Previous Tip  |  Next Tip  |  Design Tips   | [Bill's Home]

13. Lines in tables

If you look at the menu option of the right-hand side of this page you will see that there are strong lines in the menu options:

General

Design Tips
Design Studio

Graphics

Paint strokes
Focal point graphics
Xmas
Sharp graphics
Distorting graphics
Mouse-over events
Enhancing metafile
Bullets
Graphic file formats
Opacity
Column corners
Transparency

These are produced by inserting a row in the table (such as above the menu title, and then inserting a GIF file which doesn't have any content. The graphic can then be set-up with a certain height, such as with a 3-pixel height:

<td bgcolor=#000000 colspan=2><img height=3 src="nothing.gif" width=170 border=0></td>

The background to the row is also set to be the required colour, which, in this case, is BLACK (#000000). Here's another with an Orange (#99CC66) row colour:

General

Design Tips
Design Studio

Graphics

Paint strokes
Focal point graphics
Xmas
Sharp graphics
Distorting graphics
Mouse-over events
Enhancing metafile
Bullets
Graphic file formats
Opacity
Column corners
Transparency

For a vertical line, we do the same, but a column is created, and the width is varied:

Graphics

Paint strokes
Focal point graphics
Xmas
Sharp graphics
Distorting graphics
Mouse-over events
Enhancing metafile
Bullets
Graphic file formats
Opacity
Column corners
Transparency

The code for the column is thus:

<td rowspan="12" bgcolor="#000000" width=2><img
src="nothing.gif" width=2 border=0></td>

I appreciate that the grammar of the nothing.gif file is wrong, as it should be notanything.gif, as you can actually get nothing, but I'm sure you can reason the meaning from the title.