Mac Classic OS windows with css!

A couple of Mac sites have complicated tables forming Mac like windows for showing stories. I wanted to try and do this in css alone and reduce the number of graphics as well.

The css is as follows:

#box1 {
border: 1px #000000 solid;
}

#box2 {
border: 1px solid;
border-color: #fffffe #999999 #999999 #fffffe;
}

#box3 {
border: 1px #cccccc solid;
background: url(box3_full_background.gif) no-repeat #cccccc;
color: #000000;
text-align: center;
}

#box4 {
background: url(box3_right.gif) no-repeat #cccccc;
color: #cccccc;
float: right;
}

#box5 {
border: 1px solid;
border-color: #999999 #fffffe #fffffe #999999;
}

#box6 {
border: 1px #000000 solid;
color: #000000;
background: #fffffe;
padding-top: 5px;
padding-right: 5px;
padding-bottom: 5px;
padding-left: 5px;
font-weight: normal;
text-align: left;
}

5 boxes inside each other with an extra one for the right hand buttons. Viola. I will have a go at OSX and windows next.

By Simon Cox Published: Mon, May 13, 2002

Next short: Accessibility links with css

Previous short: It's a start