A snazzy border menu

Information

Now that we have Snazzy Borders it is possible to have a simplified tab menu that is infinitely resizeable.

The above menu has been produced without the aid of images and will work in IE5.01, IE5.5, IE6, Opera 7.54, Mozilla 1.75, FF and NN 7.1. I am unable to test on a Mac so would be grateful for any feedback.

Also works with iMac tested in OS 10.2.8 with Camino 0.8.1, Netscape 7.1, Internet Explorer 5.2, Safari 1.0.3 and 1.3, and Firefox 1.0 (thanks Rick).

A big thank you to Alessandro Fulciniti for his work on Nifty Corners.

============================

.outer ul {margin:3em; padding:0; list-style-type:none; background:transparent; height:3em;}
.outer li {display:block; float:left;}
.outer {display:block; position:relative; background:#eee; padding:2em; margin:20px 15px;}

.xsnazzy {background:transparent;}
.xsnazzy span {text-align:center; color:#fff; margin:0; font-weight:normal; padding-bottom:0.5em;}

.xtop {display:block; background:transparent; font-size:1px;}
.xb1, .xb2, .xb3, .xb4 {
display:block;
/* hide overflow:hidden from IE5/Mac */
/* \*/
overflow: hidden;
/* */
}
.xb1, .xb2, .xb3 {height:1px;}
.xb2, .xb3, .xb4 {background:#dd7; border-left:1px solid #fff; border-right:1px solid #fff;}
.xb1 {margin:0 5px; background:#fff;}
.xb2 {margin:0 3px; border-width:0 2px;}
.xb3 {margin:0 2px;}
.xb4 {height:2px; margin:0 1px;}

.xboxcontent {display:block; background:#cc6; border:0 solid #fff; border-width:0 1px 1px 1px;}

a.xmenu2, a.xmenu2:visited {display:block; text-decoration:none; width:7em; font-size:0.9em;}
a.xmenu2:hover {background:transparent; cursor:pointer;}
a.xmenu2:hover span {color:#000;}
a.xmenu2:hover .xboxcontent {background:#eee; border-color:#888; border-bottom:1px solid #eee;}
a.xmenu2:hover .xb1 {background:#888;}
a.xmenu2:hover .xb2, a.xmenu2:hover .xb3, a.xmenu2:hover .xb4 {background:#fff; border-color:#888;}

.xboxcontentd {display:block; background:#cc6; border:0 solid #fff; border-width:1px 1px 0 1px; padding-top:5px;}
a.xmenu2:hover .xboxcontentd {background:#eee; border-color:#888; border-top:1px solid #eee;}