CSS Features Do Not Function using Internet Explorer in Confluence but Function Correctly on Other Sites

Still need help?

The Atlassian Community is here for you.

Ask the community

Symptoms

IE's CSS functionality acts differently when served within Confluence as opposed to other sites.

Diagnosis

  1. CSS 2.1 functions work in IE 8 outside of Confluence but do not work within Confluence (eg. counter-increment, counter-reset).
  2. CSS 3 functions work in IE 9 outside of Confluence but do not work within Confluence (eg. border-radius, box-shadow).

The full CSS compatibility table can be found here.

Cause

The IE 'Compatibility View' mode renders web pages using the previous version's render engine (eg. IE 8 will render as IE 7, IE 9 will render as IE 8). When Compatibility mode is turned on, CSS 2.1 functions will not work in IE 8 and CSS 3 functions will not work in IE 9.

There is also an option to "Display Intranet Sites in Compatibility Mode." which can be enabled even if 'Compatibility View' is disabled. This can cause your Confluence server to render differently than external sites and contribute to CSS feature incompatibility.

Workaround

Disable "Display Intranet Sites in Compatibility Mode.", or restrict your CSS functions to only those supported by your browser's 'Compatibility View' mode.

Last modified on Feb 23, 2016

Was this helpful?

Yes
No
Provide feedback about this article
Powered by Confluence and Scroll Viewport.