1

Rounded corners display fine in Google Chrome, but not in IE9.

This is my css code:

.post-labels{
    position:relative;
    float:right;
    text-align:right;
    border-style:solid;
    border-color:#452C28;
    padding:10px;
    background-color:#F0ECD5;
    border-radius:15px;
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    -goog-ms-border-radius: 15px}

I've tried adding the meta tags:

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

and still nothing. What am I doing wrong?

http://costumingdiary.blogspot.com

Steve Czetty
  • 6,147
  • 9
  • 39
  • 48
Artemisia Moltabocca
  • 11
  • 1
  • 2
  • Okay, I think I answered my own question. I tried adding the following meta tag before, but it didn't work. Turns out, the meta tag referencing IE7 was at the very top of the head, which I didn't see. I'm editing a Blogger template. I changed it to: and now I have rounded corners. But now my background colors are all messed up. They changed from my regular colors to blacks and greys. I think the code writer for the Picture Window Blogger template isn't updating the code to work with IE9. – Artemisia Moltabocca Oct 02 '12 at 17:05
  • 2
    If you found an answer to your own question, go ahead and add an answer, and mark it as "Accepted" so that others may benefit from your discovery! – Steve Czetty Oct 03 '12 at 16:11
  • Please, check this: http://stackoverflow.com/questions/10784999/border-radius-not-working-in-ie9 Espero sea útil. – user3473248 Apr 29 '14 at 15:15

1 Answers1

0

Your code works fine on IE9 without any meta tags. Demo.

Just remove all of the meta elements that are messing with your version and make sure that your browser is not in compatibility mode (hit F12 and make sure Browser Mode and Document Mode are both IE9).

brentonstrine
  • 21,694
  • 25
  • 74
  • 120