This demo was inspired by a technique developed by Steve Clay
It seems to work as claimed in: Mozilla 1.4, IE6, and Opera7.
Box borders are red so they can be seen easily, corner images have no border in this demo.
The first thing I noticed with the original code on testing in IE5 Mac is that the two left corners were 15px to the right, due to that browser's relative position bug. "Some block elements inside relatively positioned elements incorrectly inherit their parent's positioning information."
I fixed this by hiding div.boxwrap {padding-left: 15px;} from Mac using the commented backslash hack V2.
Problems that still exist in IE5 Mac:
bl {top: *px;} at all, no matter what the value. div.boxwrap {z-index:1;} and
.tl, .tr, .bl, .br {z-index: 5;} doesn't help.The most reliable cross-browser solution seems to be John Wilkin's Bullet-Proof Rounded Corners - works everywhere except relative IE5 Mac divs. The downside is that all the corner images must be in the html, which does not fulfill my aim of having presentation information in the stylesheet where it belongs.
Another attempt at rounded corners with borders has been made by Dan Loda (which he says doesn't work in IE5 Win, or relatively positioned divs in IE5 Mac).
However, Susanna King reckons that Dan's approach does work in IE5 Win, but that Safari has problems (which she fixed with a JavaScript browser detect to change the offending style).
Guy Fisher says that his technique works in IE 5.0 & 6.0, NN 6.2.3 & 7.01, Moz 1.2.1, and Op 7.01 [Win] and IE5, NN6.2 [Mac]. As for Safari???
Roger Johansson has come up with something that uses one div for each corner and works well across the browsers he's tested (Moz 1.4 Mac/Win, Safari, IE5/Mac, Opera 6 Mac, Opera 7 Win, OmniWeb 4.5, IE6/Win).
Douglas Livingstone at Redmelon uses only four divs, images in CSS, and claims his technique works everywhere. Example page doesn't validate also seems to close too many divs - test carefully.
Andreas Kalt has a version based on Douglas Bowman's ALA article “Sliding Doors of CSS” .
Ryan Thrash's "The ThrashBox" – is also based on Bowman's work.
The version by Marek Prokop uses nine nested divs - but can include shadows on the box. He's tested in IE 5 & 6, Moz and Op 6 [Win]. It works for me in IE5 Mac - and Adam Kuehn reports success in Safari as well, so it looks like the most flexible way to go.