Geek Answers Handbook

IE9 border radius

CSS curved corners for some reason do not work in IE9. I know that he supports it, however I looked all over the Internet for a solution and cannot find the one that works for me. I tried putting <meta http-equiv="X-UA-Compatible" content="IE=9" /> , but that didn't work. I used the .htc file and behavior: url(border-radius.htc); However, this only works when switching to compatibility mode. I even tried to declare all 4 values ​​and made no difference. Work in firefox, chrome and safari, but not in IE. Any help? Check this out: my webpage If you have a debugging tool, you can help me.

+2
source share
6 answers

It looks like the page is starting Quirks mode, try moving these script and css includes inside the tag ... nothing should happen between doctype and the html tag.

A detailed explanation is here Exploring problems with document mode

+6
source

I found that if you use the CSS filter style for IE8 and below browsers, this will interfere with IE9 styles, causing border-radius not work and prevent other harmful effects.

To fix this, add this to your html header:

 <!--[if gte IE 9]> <style type="text/css">.elementClass { filter: none !important; }</style> <![endif]-->'
+8
source

Use vendor extensions, -moz-border-radius:15px; -ms-border-radius:15px; -o-border-radius:15px; -webkit-border-radius:15px; border-radius:15px; -moz-border-radius:15px; -ms-border-radius:15px; -o-border-radius:15px; -webkit-border-radius:15px; border-radius:15px;

You really need the -ms version for what you want, but if you include everything in it that you provide a wider range of coverage.

+6
source

I found that my border radius in ie9 works on localhost, but not on the server. Im using css3PIE for acomidate ie8 and below, will it interfere with ie9?

+2
source

IE9 does not need a prefix for border-radius (for sure you do not need the -ms- prefix, at least for this property!). Your browser probably has a problem. Perhaps you are using a beta or something like that.

Test this demo on another computer with IE9 or restart IE and try to see how IE9 displays border-radius perfectly.

+1
source

Quirks mode is where IE9 switches to IE5 functionality (the following link to the @seanmetzgar post is also added)

A detailed explanation is here Exploring problems with document mode

With the site I'm doing, which had ASP code at the top right of the page, I added

 <!DOCTYPE html>

right in front of the tag, under the code, and IE9 stopped in Quirks mode.

0
source

More articles:


All Articles