CSS3PIE element corners with different radii using border-radius?

0
votes

I have an element where the top-left and bottom-right corners have a border-radius of 5 and I'm trying to make it compatible with CSS3PIE. The documentation states that

Only the shorthand version is supported; the longhand border-top-left-radius etc. properties are not. The shorthand syntax does support different radii per corner, though. link

But in the example they display exactly that ...

border-radius: 5px 10px 15px 20px;

How can I display an element that has corners with different radii in IE8?

Thank you.

a.navLink {
       -moz-border-radius: 5px 0 5px 0;
    -webkit-border-radius: 5px 0 5px 0;
            border-radius: 5px 0 5px 0;
    display: block;
    behavior: url('http://mydomain.com/css/PIE.htc');
    position:relative;
    z-index: 0;
1
frontendcsscss3pie
I'm confused, you quote the documentation saying how to do it, but then ask how to do it? Are you saying it does not work for you? I can tell you it does. – lojjic
Yes. It doesn't work for me. With this only the top-left corner has a radius. – Tiny

1 Answers

1
votes

add the -pie- prefix:

-pie-border-radius: 5px 0 5px 0;