Internet Explorer 9显示的按钮与IE10，Firefox和Safari等不同

Question

im having some trouble with my website

<a href="#" class="button">read more</a></div>

This code displays a rounded blue button:

picture of what it looks like : http://i.stack.imgur.com/NQR5r.png

I cant seem to figure out why. i moved my website pages (for example contact.html about.html ) to individual folders and named them all index.html so when the URL loads it doesnt show www.websitename.com/contact.html, it now shows www.websitename.com/contact. but ever since, the below issue is happening. everything else is fine, all other things load fine, just this specific button.

This is the CSS behind the button:

.text .button {
    display:inline-block;
    font-size:30px;
    font-weight:700;
    color:#fff;
    line-height:53px;
    padding:0 37px;
    background:url(../images/button_bg.gif) top repeat-x #308da2;
    border-radius:10px;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    behavior:url(../js/PIE.htc);
    position:relative;
    text-decoration:none;
}

your help would be much appreciated. thanks

Answer 1

please insert demo or jsfiddle.net link, in this way we will have access to your resources. but have you inserted this code?

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