Please see the following JSFiddle:
Notice that the child div clips the border of its parent. If I remove the border (but keep the rounded corners), the item clips as we would expect. Firefox 4 renders this markup as I expect, with the item clipped before the border starts. Chrome, however, does not clip the child until the border's outer edge is reached.
Who has this behavior correct, and is there a hack? I am fine with leaving it in chrome if it is a bug that will be fixed, but I will need to tweak the layout if it is rendering to spec in Chrome.
(please note before you vote to close, this is a different bug than the multiple threads about a firefox 3.5/Chrome bug which prevented items from being clipped at all by rounded borders)
Give the child element a radius of half the border-radius of its parent.
border-top-left-radius: 5px;
Example here: http://jsfiddle.net/zScKW/1/