By default html table border (border=”1″) does not look good. It looks horrific in most of the browsers. You can easily change the looks of your table using this following CSS. The trick is to let cells to have only the top and right borders, add all borders to the table and no border to header cells.

<style type=”text/css”>
table, td, th
{
border-color: #ff0000;
border-style: solid;
}

table
{
border-width:1px;
}

td
{
margin: 0;
padding: 4px;
border-width: 1px 1px 0 0;
background-color:#CCFFFF;
border-color:#dddddd;
border-spacing:0;
border-collapse:collapse;
}

th
{
margin: 0;
padding: 4px;
border-width: 0;
background-color: #FFFF00;
}
</style>

<table cellspacing=”0″>
<tr>
<th>HEAD 1</th>
<th>HEAD 2</th>
<th>HEAD 3</th>
</tr>
<tr>
<td>Cell 1</td>
<td>Cell 2</td>
<td>Cell 3</td>
</tr>
<tr>
<td>Cell 4</td>
<td>Cell 5</td>
<td>Cell 6</td>
</tr>
</table>