Border Radius Problem

[mozmeny]

Hi everyone,
I am a starter for CSS and I failed to solve a problem. Hope you guys can help me about that. Below is a div css class. The problem is, when I display it on IE(11,10,9,etc..) I can see thin lines around the div (adjacent to border) having #ff6b00 as the color. This does not look so neat. I do not come across the problem in Chrome. This is how it looks in IE

http://tinypic.com/r/fnh7qp/8

.MediumLockerInfo {
position: relative;
background-color: #ff6b00;
border-radius: 8px;
border-width: 2px;
border-color: #783f08;
border-style: solid;
padding: 2px 2px;
height: 52px;
}

[Paulie_D]

Do you have a live link?

It looks like an anti-aliasing or sub-pixel issue….at the moment.

[Senff]

Not all too much work: http://codepen.io/senff/pen/lxFdt

[Paulie_D]

True…and I can see it in IE11…but I had to zoom A WHOLE HECK OF A LOT…c180%

[Senff]

I see it with 100% zoom. I’d just attribute it to the way IE renders it — but in this specific case, I don’t see any use of having a border on the elements that’s the same color as the background.

[Paulie_D]

Yeah…that’s what margins are for.

[Vishal Somani]

I am facing same issue, how can I solve that.

[Author]

Posts