IE and CSS3

XXXconanXXX

Cocktails anyone?
Reaction score
284
Is it just me or does IE not want to display any CSS3 properties?

I did some digging and found that the "border-radius" property is supposed to work in all browsers, with a -moz- prepended to it so it'll work in FF 3.6 and before. That's all fine and dandy, but when I use the property and open IE9 to view it, it gives me the basic cornered border? The CSS I'm using looks like this:

Code:
	border:1px solid black;
	padding:5px;
	border-radius:10px;
	-moz-border-radius:10px;

It's basic enough, but it won't work in IE9. Is there a reason for this? W3C says IE supports it - is it supposed to go before the border property or something?
 

Artificial

Without Intelligence
Reaction score
326
Try adding the
HTML:
<meta http-equiv="X-UA-Compatible" content="IE=9" />
tag in your page's head. This should make IE9 treat the page as an IE9 document instead of an IE7 or IE8 document. Declaring the page as an HTML5 document with
HTML:
<!doctype html>
should also do that according to Microsoft's website, but apparently they failed to implement such a complicated feature (without the meta tag the doctype declaration is turned into a comment...).

This solution worked for me, though only if the meta tag was above the style declarations that used CSS3.
 

Magentix

if (OP.statement == false) postCount++;
Reaction score
107
By pressing F12 in IE9 you can verify yourself what browser/document mode you're in.
Also: always put browser prefixed style declarations above the 'real' ones:

Code:
	border:1px solid black;
	padding:5px;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	border-radius:10px;
 
General chit-chat
Help Users
  • No one is chatting at the moment.

      The Helper Discord

      Staff online

      • Ghan
        Administrator - Servers are fun

      Members online

      Affiliates

      Hive Workshop NUON Dome World Editor Tutorials

      Network Sponsors

      Apex Steel Pipe - Buys and sells Steel Pipe.
      Top