[thelist] trying to get a table border using CSS

Aylard JA (James) jaylard at equilon.com
Tue Jul 11 11:29:03 CDT 2000


Tara,

> I've got this table ya' see... I need to have light grey lines around the 
> cells in the table. I know I can do it by stretching a single pixel gif,
but 
> is there any way I can do it with CSS?

	Yes. The easiest way is to use the CSS2 property "border-collapse"
with a value of "collapse" on your table element. You will want to set
cellspacing in your table to zero, and you can either set your border to one
within the table element or, for greater control and consistency, apply a
border to your td elements through a style sheet. The end result would look
something like this:

<style type="text/css">
  table {
    border-collapse: collapse ;
  }
  td {
    border: 1px solid #cccccc ;
  }
</style>

...

<table cellspacing="0">
  <tbody>
    <tr>
      <td>Cell A1</td><td>Cell A2</td>
    </tr>
    <tr>
      <td>Cell B1</td><td>Cell B2</td>
    </tr>
  </tbody>
</table>

	Both IE5+ and Netscape 6 support the border-collapse property.

hth,
James Aylard
jaylard at equilon.com




More information about the thelist mailing list