Border radius effect with IE9 and a solid border
I just noticed that my address link styled as a button does not properly show a radius in IE9 when using the CSS below:
a.btn {
backg开发者_运维问答round: #F00;
color:#333;
font-size:12px;
padding: 3px 4px 3px 4px;
border:1px solid #444;
border-radius:3px 3px 3px 3px; -moz-border-radius:3px; -webkit-border-radius:3px;
cursor:default;
}
CSS example
When I remove the border:1px solid #444; then a nice curved border appears.
Is this a bug with IE? In Firefox everything works good. Anyone else seen anything like this? Seems like it only happens when border-radius is set to a low value. I know this is not very important on the scale of things but I'm interested to hear if anyone knows why the radius doesn't properly show.
It works for me. Check it using
border-radius: 20px;
http://jsfiddle.net/6Nr2n/1/
http://prntscr.com/2djxa
精彩评论