border-radius gets weird when property has different values for corners on IE lte 8

Question

I'm applying border-radius for a few elements on my page, and in order to make it work on IE 6-8, I'm using PIE.

Check it out

So as you can see, corners without values (or with values very different from each other) for border-radius, effect gets this weird.

Here's my code:

.cotacao {
  -webkit-border-radius: 1px 20px 1px 20px;
  -moz-border-radius: 1px 20px 1px 20px;
  border-radius: 1px 20px 1px 20px;
  border: 10px solid #fff;
}

And specific code for IE

.cotacao {
  behavior:url(/Assets/css/common/PIE.htc);
  position: relative !important;
}

What's going on? Is this bug related to the border thickness? And, if it is, is there a known workaround? Thanks!

Answer 1

This is a bug in the PIE 1.0 code. See https://github.com/lojjic/PIE/issues/11

It's fixed in the 2.0 beta if you're willing to try that.