One easy way to
create table borders in HTML is by nestling a
table inside another table. This seems to work
well for displaying crisp outlines around tables
and displays nicely in most popular browsers.
I like the look better than the default table border
attribute because that default attribute is displayed
differently among various browsers like Netscape,
Internet Explorer and Firefox. See the difference below:
Chances are you will see small border
size and /or appearance differences between these two examples
above. I prefer to design my tables so they look consistent
among all popular browser types. I also like to have complete
control over color values and border size. Overall Nestled
tables are more flexible in regard
to controlling appearance.
How to Apply Nestled Table
Borders In the example code view below
you can see the first <table> tag is filled with
background bgcolor=#000000 (black) and has a cellpadding of "1".
This is what defines the border for the inner or nestled
inner table.
The nestled inner table is set at 100% width but the other
attributes can be set to anything desired. For example
purposes at
this stage keep cellspacing at zero "0".
I would receommend using this as a model. Click
here to copy paste.
Example
3 showing the HTML code view for nestled table
border
Simply
highlight the code below and copy/paste it into
your HTML page after the <BODY> tag. This
will give you a model to work with. Adjust settings
according to your particular need.
