Chrome doesn’t understand my border-radius property all of sudden

[hackyaaa]

nav[role=”full-top”] ul > li:after {

position: absolute;
z-index: -1;
content: “”;
right: 0;
border-radius: 50%;
border-radius: 5em;
box-shadow: 1em 1em 0 2em rgba(255, 255, 255, 0.5);

}

Chrome used to understand the border-radius property either in % or in em/px. In IE9 & IE10, % does not work.

Now, the border-property is only working in IE, not in Chrome. And this happened overnight.

What is going on? Why is Chrome all of sudden becoming stupider than IE?

I wish I could laugh about this except this is effecting my own site’s main menu.

[Paulie_D]

Why do you have two radius declarations?

[CrocoDillon]

> I wish I could laugh about this except this is effecting my own site’s main menu.

Which is where?

[hackyaaa]

Solved by adding Chrome hack. This turns out to be a Chrome 27.0.1453.93 bug.

@Paulie_D, two declaration is needed because of cross browser issue. IE doesn’t understand %.

[CrocoDillon]

How did you solve it?

About the two border-radius properties, I’d put the fall-back before the desired value, so `em` before `%`. But I just tested on IE9 and IE10 and it worked with % so…

[Author]

Posts