Valid CSS!

Valid XHTML 1.1

Decorating with HTML Tables

Simple scrollwork around contents

HTML tables can be used as a primitive (and clumsy) drawing mechanism. There are a few simple applications. The main advantage is that separate image files are not necessary.

A nice texture may be specified by setting the background-image property.

simple scrollwork

Mozilla FireFox, Opera 7+, Konqueror 3.1+, Amaya 8.8, and Chrome all show very nice scrollwork.

None of links, lynx, dillo and brx show any sign of decoration whatever, which is good.

IE 6 Windows, 5.2.1. Mac: perfect.

In the above example, I’ve put an inner table with a border around the contents, just so the contents would be circumscribed in lower-powered browsers.

Scrollwork around contents with border

A nice 3D effect can be achieved using the cell border property.

simple scrollwork

Konqueror does well.

Opera 9 is perfect.

Mozilla FireFox 1.5: perfect

IE 5.2.1. Mac: does odd and wrong thing with border: puts extra space between cell and border with ugly results.

IE 6 Windows: Very curious effect (not really bad-looking) has the horizontal borders thin while the vertical ones are thick, and somehow, there is a pixillated round area within the scrolls…weird.

IE 7 beta: works well

Thick borders are out. The lines don’t connect properly in the best cases.