Some users of the first Beta Version or one of the previous Platform Previews may have wondered why the
IE 9 ignores the CSS 3 declarations of WBB 3.1 - two things cause that behaviour:
- First: not all styles (for example all styles by WoltLab) have the necessary declarations - the IE does not use so called vendor-prefixes, it interpretes the correct CSS 3.
1 example: Firefox (lower than Version 4) needs "rounded corners" declared the following way:
|
Cascading style sheet
|
1
|
.classname {-moz-border-radius: 10px;}
|
Internet Explorer doesn't know this command, but uses the standard declaration
|
Cascading style sheet
|
1
|
.classename {border-radius: 10px;}
|
- Second: the WBB 3.1 disables the IE 9 mode and forces the browser to display the style as IE 8 did. That's because of IE 8's misbehaviour to always switch to compatiblity mode causing a lot of diplay errors.
The following code is the one forcing IE 9 to display like IE 8:
|
HTML
|
1
|
<meta http-equiv="X-UA-Compatible" content="IE=8" />
|
You'll fin that code snippet in the headInclude template.
In order to give IE 9 users the possibility to have all the declarations working the way they should, you can use the follwoing code snippet in your headInclude template using IE Conditional Comments.
|
HTML
|
1
2
3
4
5
6
7
|
<!--[if IE 8]>
<meta http-equiv="X-UA-Compatible" content="IE=8" />
<![endif]-->
[html]<!--[if IE 9]>
<meta http-equiv="X-UA-Compatible" content="IE=9" />
<![endif]-->
|
the last part for IE 9 is essential avoiding IE 9 to switch to compatibility mode.
Attention: You use this code at your own risk. The standard templates can not be edited via ACP - and they shouldn't be edited. When updating the WBB the changes could be lost.