Home > Help
files >>
Table borders
Table borders
Netscape and Internet Explorer do not read table borders
the same way, particularly regarding color and style.
To achieve a consistent look between browsers you can
nest tables, allowing one of them to give the appearance
of a border.
|
|
1. Make the "underneath" table, giving it
three rows and three columns. It is best to set the
width in pixels. Cell spacing and padding should be
set to zero.
2. Set the table background color to the color you
desire for the border.
3. Merge the top three cells.
4. Merge the bottom three cells. (view 1)
|
view 1 |
|
5. Insert a 1x1 transparent .gif into the top cell,
bottom cell, and each of the side cells. Leave the center
cell empty. For this exercise we are assuming you want
a one pixel wide border. If you want one wider, you
will need to adjust the height of the .gifs in the top
and bottom cells and the width of the .gifs in the side
cells. (view 2)
|
view 2 |
|
6a. Insert a second table into the center cell, giving
it one row and one column. The width should be two pixels
less than the first table. Set cell padding to 5.
Do not be alarmed if it does not look just right. (view
3)
|
view
3 |
|
7a. Set the table background color to one that contrasts
with that of the first table.
When you preview in browsers, it should appear similar
to the table in view 4.
|
view 4 |
|
OR
|
|
|
6b. Insert a second table into the center cell, giving
it two rows and two columns. The width should be two
pixels less than the first table. Set cell padding to
5 or the approximate amount of space you wish to have
between the cell wall and content. Set cell spacing
to two.
Do not be alarmed if it does not look just right. (view
5)
|
view 5
|
|
7b. Set the cell backgrounds to colors that contrast
with that of the first table.
When you view in browsers the table should look similar
to view 6.
|
view 6 |
