Kompx.com or Compmiscellanea.com

HTML table borders without CSS

Windows : Internet Explorer 3.0+, Netscape 3.04+, Opera 3.50+ [ 1 ], Mozilla 0.6+, Firefox 1.0+, Google Chrome, Safari 3.1+, SeaMonkey 1.0+.

Linux : Netscape 3.04+, Opera 5.0+, Mozilla 0.6+, Firefox 1.0+, Chromium, SeaMonkey 1.0+, Netsurf 3.0, Dillo [ 2 ].

DOS : Arachne [ 3 ].

Example n.1:

  HTML table borders without CSS  
cellspacing="2"   bgcolor="#ff6600"

HTML / XHTML. Code:

<table width="100%" cellspacing="2" cellpadding="0" border="0" align="center" bgcolor="#ff6600">

<tr bgcolor="#ffffff">

<td width="33%" height="67">&nbsp;</td>

<td width="34%">HTML table borders without CSS</td>

<td width="33%">&nbsp;</td>

</tr>

<tr bgcolor="#ffffff">

<td height="67">cellspacing="2"</td>

<td>&nbsp;</td>

<td>bgcolor="#ff6600"</td>

</tr>

</table>

Example n.2:

  HTML table borders without CSS  
cellspacing="8"   bgcolor="#999999"

HTML / XHTML. Code:

<table width="100%" cellspacing="8" cellpadding="0" border="0" align="center" bgcolor="#999999">

<tr bgcolor="#ffffff">

<td width="33%" height="67">&nbsp;</td>

<td width="34%">HTML table borders without CSS</td>

<td width="33%">&nbsp;</td>

</tr>

<tr bgcolor="#ffffff">

<td height="67">cellspacing="8"</td>

<td>&nbsp;</td>

<td>bgcolor="#999999"</td>

</tr>

</table>

Example n.3 - for Netscape 3.04-6.0, Mozilla 0.6-0.92 and Arachne. It works in other web browsers as well:

  HTML table borders without CSS  
cellspacing="2"   bgcolor="#999999"

HTML / XHTML. Code:

<table width="100%" cellspacing="0" cellpadding="0" border="0" align="center" bgcolor="#999999">

<tr>

<td>

<table width="100%" cellspacing="2" cellpadding="0" border="0">

<tr bgcolor="#ffffff">

<td width="33%" height="67">&nbsp;</td>

<td width="34%">HTML table borders without CSS</td>

<td width="33%">&nbsp;</td>

</tr>

<tr bgcolor="#ffffff">

<td height="67">cellspacing="2"</td>

<td>&nbsp;</td>

<td>bgcolor="#999999"</td>

</tr>

</table>

</td>

</tr>

</table>

HTML table borders without CSS

Some time ago, mostly (but not only) in 1990s there were several pure HTML tricks used to achieve things now done by CSS. Handling HTML table borders was one of them.

It is not exactly handling borders, but rather imitating doing it by exploiting the cellspacing and bgcolor attributes. Nowadays, as with centering page content by table tag, this method is perfectly usable, even if obsolescent in its concept.

The concept

1. The bgcolor attribute of the table tag is used to make the background of a table to be of a certain color.

2. The bgcolor attribute of the tr tag is employed to make the background of the table's content (i.e., rows and cells) to be of a certain, different from the table's background, color.

3. The cellspacing attribute of the table tag is used to create the space of a certain amount of pixels around the table cells. That space gets the color set by the bgcolor attribute of the table tag - since it differs from the background of rows and cells, this creates visual boundary line of the table's background color around the cells.

The steps aforementioned create in Arachne a visual boundary line only between the table cells, not around them. And these steps does not make at all any visual boundary line in Netscape 3.04-6.0 and Mozilla 0.6-0.92. So an additional table around the first one should be created.

The bgcolor attribute of the table tag is removed from the inner table and given to the outer one. The cellspacing attribute of the outer table is set to "0". It creates the required visual boundary both in Arachne and Netscape 3.04-6.0, Mozilla 0.6-0.92.

This method works not only in Netscape 3.04-6.0, Mozilla 0.6-0.92 and Arachne, but also in other web browsers as well, so it may be used as a universal one.

Demo page for Internet Explorer 3.0 - the content text is also styled and centered without CSS: [ Open demo page ] [ Download archive file ].

Internet Explorer for Windows, older versions ( Download pack, containing 3.0, 4.01, 5.01, 5.5, 6.0 versions of Internet Explorer )

Demo page for Netscape 3.04-6.0 and Mozilla 0.6-0.92 - the content text is also styled and centered without CSS: [ Open demo page ] [ Download archive file ].

Netscape Navigator 3.04 for Windows ( Download )

Netscape Communicator 4.7 for Windows ( Download )

Netscape Navigator 6.01 for Windows ( Download )

Mozilla 0.6 for Windows ( Download )

Mozilla 0.92 for Windows ( Download )

Demo page for Arachne - the content text is also styled and centered without CSS: [ Open demo page ] [ Download archive file ].

Arachne 1.70 for DOS ( Download )

Arachne 1.95 for DOS ( Download )


[ 1 ]

It works also in Opera 2.12 - 3.50, but with certain flaws.

[ 2 ]

Dillo - partially. Dillo does not recognize the height attribute for td or tr. The visual boundary line trick in itself does work.

[ 3 ]

With a minor flaw.


Aliosque subditos et thema


CSS for a range of elements


Styling a range of elements. Here from the 1st to the 3rd one - changing background color. Example:         HTML / XHTML. Code: <div>&nbsp;</div> <div>&nbsp;</div> <div>&nbsp;</div> <div>&nbsp;</div> CSS. Code: div:nth-of-type(-n+3) {background: #f66;} /* Extra CSS, just styling the look: */ div {width: 100%; margin-top: 5px; background: #066;} Note: nth-child may also be used instead.

Text-based web browsers for Linux


Lynx : Links : ELinks : W3m : Netrik : Retawq : Line mode browser When general public Linux distributions came around, web browsing was quite young, but with some way behind it. There were several web browsers already, many of them ported gradually to Linux. Some text-based web browsers were in the first wave. After a while Linux became the main habitat of text-based browsers, where most of them are developed and used. Even if these text-based web browsers are mostly intended not just for Linux, but for various other *nix systems as well. And there are also their ports to plenty of other operating systems for most various platforms. Lynx - / home page / Text-based web browser. Versions for Linux, FreeBSD, Mac OS X, some other *nix systems, DOS, Windows, BeOS, MINIX, QNX, AmigaOS, OpenVMS and classic Mac OS. HTML ( More 1 ) ( More 2 ) Lynx 2.8.7rel.1 in GNOME Terminal 2.32.1 on Zenwalk Linux: lynx.isc.org Lynx 2.8.7rel.1 in GNOME Terminal 2.32.1 on Zenwalk Linux: w3schools.com/browsers/browsers_stats.asp Lynx 2.8.7rel.1 in GNOME Terminal 2.32.1 on Zenwalk Linux: en.wikipedia.org/wiki/Lynx_(web_browser) Lynx 2.8.7rel.1 in GNOME Terminal 2.32.1 on Zenwalk Linux: ebay.com Lynx 2.8.7rel.1 in GNOME Terminal 2.32.1 on Zenwalk Linux: kompx.com/en/elinks.htm Lynx 2.8.7rel.1 in GNOME Terminal 2.32.1 on Zenwalk Linux: twitter.com Links - / home page 1 : home page 2 / Text-based web browser. Versions for Linux, FreeBSD, Mac OS X, some other *nix systems, BeOS, Haiku, OS/2, DOS, Windows.