---

TABLE PROPERTIES

Table & Cell Border

<style type="text/css">
table {border: 5px solid orange}
td {border: 5px solid red}
</style>
...
<table>
<tr><td>Food</td>
    <td>Drink</td>
    <td>Sweet</td> </tr>
<tr><td>A</td>
    <td>B</td>
    <td>C</td> </tr>
</table>

Cell Spacing
{border-spacing: # }
    #=length (px, pt, in, cm, em)

<style type="text/css">
table {border: 5px solid orange;
       border-spacing:15px}
td {border: 5px solid red}
</style>
...

Borders around Empty Cells
{empty-cells: # }     #=show, hide

<style type="text/css">
table {border: 5px solid orange; empty-cells: #}
td {border: 5px solid red}
</style>
...
<table>
<tr><td>Food</td><td>Drink</td><td>Sweet</td> </tr>
<tr><td>A</td><td>B</td><td></td> </tr>
</table>

empty-cells:show

empty-cells:hide

{border-collapse: # }
#=separate, collapse

<style type="text/css">
table {border: 5px solid orange}
td {border: 5px solid red}
</style>
...
<table style="border-collapse:#">
<tr><td>Food</td><td>Drink</td><td>Sweet</td>
<tr><td>A</td><td>B</td><td>C</td>	
</table>

border-collapse:separate

border-collapse:collapse

{table-layout: # }
#=auto, fixed

<table border style="table-layout:#">
<tr>
   <th width="100" height="30">NAME</th>
   <td width="100" height="30">Network Communication Design</td>
</tr>
<tr>
   <th>URL</th>
   <td>/</td>
</tr>
</table>

table-layout:auto

table-layout:fixed

{caption-side: # }
#=top, bottom, left, right

Netscape 6 doesn't support "left" and "right".

<table border>
<caption
   style="caption-side:bottom">
 Lunch</caption>
<tr><td>Food</td>...</tr>
<tr><td>A</td>...</tr>
</table>

Style Sheet Guide | HTML Design Guide
Basic | Selector | Cascading
Font | Text | List | Color & Background | Box | Table | Position & Format | Other|
Selector List | Property List


Network Communication Design - /
Copyright & Publishing 1994-2008 Network Communication Design