Support for "border-radius" in IE

internet-explorer css
Tony the Pony picture Tony the Pony · Mar 11, 2009 · Viewed 385.9k times · Source

Does anyone know if/when Internet Explorer will support the "border-radius" CSS attribute?

Answer

Kevin Florida picture Kevin Florida · Sep 24, 2010

Yes! When IE9 is released in Jan 2011.

Let's say you want an even 15px on all four sides:

.myclass {
 border-style: solid;
 border-width: 2px;
 -moz-border-radius: 15px;
 -webkit-border-radius: 15px;
 border-radius: 15px;
}

IE9 will use the default border-radius, so just make sure you include that in all your styles calling a border radius. Then your site will be ready for IE9.

-moz-border-radius is for Firefox, -webkit-border-radius is for Safari and Chrome.

Furthermore: don't forget to declare your IE coding is ie9:

<meta http-equiv="X-UA-Compatible" content="IE=9" />

Some lazy developers have <meta http-equiv="X-UA-Compatible" content="IE=7" />. If that tag exists, border-radius will never work in IE.

Related questions

Hide scroll bar, but while still being able to scroll

I want to be able to scroll through the whole page, but without the scrollbar being shown. In Google Chrome it's: ::-webkit-scrollbar { display: none; } But Mozilla Firefox and Internet Explorer don't seem to work like that. I also tried this …

Read More
Apply style ONLY on IE

Here is my block of CSS: .actual-form table { padding: 5px 0 15px 15px; margin: 0 0 30px 0; display: block; width: 100%; background: #f9f9f9; border-top: 1px solid #d0d0d0; border-bottom: 1px solid #d0d0d0; } I only want IE 7, 8, and 9 to "see" …

Read More
Div with horizontal scrolling only

I have a fixed width DIV containing a table with many columns, and need to allow the user to scroll the table horizontally within the DIV. This needs to work on IE6 and IE7 only (internal client application). The following …

Read More