Hi,
I do not see the difference in my browser between these two:
1.
[code]
<!–Table Border Collapse–>
table {
width: 100%;
border-collapse: collapse;
}
2.
[code]
<!–Design Cell-less Table–>
table {
border: 1px solid;
The above two codes show table appearance the same it would show if I was using:
[code]
table, th, td {
border: 1px solid;
}
See for yourselves by testing above two one by one with following table code….
[code]
<table name=”characters”>
<caption>Caption</caption>
<colgroup>
<col span=”3″ style=”background-color:white;”>
<col span=”3″ style=”background-color:blue;”>
<col span=”3″ style=”background-color:yellow;”>
</colgroup>
<thead>
<tr>
<th colspan=”3″>GOOD</th><th colspan=”3″>BAD</th><th colspan=”3″>NEUTRAL</th>
</tr>
</thead>
<tbody>
<tr>
<td>Title</td><td>FIRST NAME</td><td>SURNAME</td><td>Title</td><td>FIRST NAME</td><td>SURNAME</td><td>Title</td><td>FIRST NAME</td><td>SURNAME</td>
</tr>
<tr>
<td id=”gt0″>Mr</td><td id=”gf0″>Muhammad</td><td id=”gs0″>Ali</td><td id=”bt0″>Mr</td><td id=”bf0″>Adolph</td><td id=”bs0″>Hitler</td><td id=”nt0″>Mr</td><td id=”nf0″>Mohandas</td><td id=”ns0″>Ghandi</td>
</tr>
<tr>
<td id=”gt1″>Mr</td><td id=”gf1″>Mike</td><td id=”gs1″>Tyson</td><td id=”bt1″>Mr</td><td id=”bf1″>Winston</td><td id=”bs1″>Churchill</td><td id=”nt1″>Mr</td><td id=”nf1″>Crocodile</td><td id=”ns1″>Dundee</td>
</tr>
<tr>
<td id=”gt2″>Mr</td><td id=”gf2″>Malcolm</td><td id=”gs2″>X</td><td id=”bt2″>Mr</td><td id=”bf2″>Joseph</td><td id=”bs2″>Stalin</td><td id=”nt2″>Mr</td><td id=”nf2″>Napolean</td><td id=”ns2″>Bonaparte</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan=”3″>GOOD</td><td colspan=”3″>BAD</td><td colspan=”3″>NEUTRAL</td>
</tr>
</tfoot>
</table>
This shows differences: