Geek Answers Handbook

IE 9 and button element style

I have a button element where I apply the css class that adds border color to different sides of the button. This worked in previous versions of IE, but not in IE 9

HTML:

<button class="hello-button">Hello, World</button>

CSS:
.hello-button {     
    border-width: 2px;
    border-style: solid;
    border-color: #eee #a9a9a9 #a9a9a9 #eee;
}

This is a known issue, and there are workarounds beyond the border style: the beginning; I tried various combinations, but it seems that you can no longer erase the borders of a button element.

Edit: Formation

+5
source share
4 answers

If you specify 3 borders, these borders will be displayed in IE9. As soon as you specify the 4th border, IE9 refuses to display any of the borders

Works:

.hello-button {     
    border-top: 2px solid #eee;
    border-right: 2px solid #a9a9a9;    
    border-bottom: 2px solid #a9a9a9;   
}

Does not work:

.hello-button {     
    border-top: 2px solid #eee;
    border-right: 2px solid #a9a9a9;    
    border-bottom: 2px solid #a9a9a9;   
    border-left: 2px solid #eee;
}

(, , spec'd) , ...

+5

. , . IE9 , .

, border-radius ( ). , CSS:)

, , , ( , ).

+1

. , , X-UA-Compatible IE = EmulateIE8

http://msdn.microsoft.com/en-us/library/cc288325%28v=vs.85%29.aspx#Servers

-1
source

More articles:


All Articles