Possible problem with rounded corners

(repost of my question/remark, apparently the original message was
posted in a different thread. Excuse my lack of knowledge of mailing
lists and threaded mails, I'll try to pay more attention next time)

 

I was experimenting with the border-radius implementation of Firefox and
WebKit and ran into some problems. I checked the ccs3 specs but couldn't
find anything about it, so I'll guess I'll just post this here. Again,
my apologies if this problem was already raised before and is being
worked on right now.

 

The problem occurs when elements are nested inside a container with
rounded corners. The background of the container behaves well, but the
nested elements are still rectangles. So when they are given a
background-color, they overlap the rounded corners.

 

I made a very simple test page, with a horizontal navigation (4 rounded
corners) and hover color on the links in the list items. Just hover over
the first list item to see the undesired effect.

 

http://www.onderhond.com/testpages/rounded-corners.html

 

It would be a real shame if this behaviour would still exist when we
could finally use the property, as workarounds to fix this are pretty
crappy and really mess up the css.

 

Greets,

Niels Matthijs

Internet Architects