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

Platform Notice: Data Center Only - This article only applies to Atlassian products on the Data Center platform.

Note that this KB was created for the Data Center version of the product. Data Center KBs for non-Data-Center-specific features may also work for Server versions of the product, however they have not been tested. Support for Server* products ended on February 15th 2024. If you are running a Server product, you can visit the Atlassian Server end of support announcement to review your migration options.

*Except Fisheye and Crucible

Summary

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.

Solution

Workaround

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

Updated on April 2, 2025

Still need help?

The Atlassian Community is here for you.