MG said:
There is a table on this page:
www.sallys.co.za/venue.htm
In IE it displays the way I expect it to. However, in FF the table border
becomes "detached" from the table. ie there is a large space between the
table and its border.
What causes this?
Not Firefox but IE, IE is improperly ignoring the padding that you put
on the table as Rick pointed out.
The table's padding should be added to the border-spacing for the
exterior table cells in the table. IE is not playing by the rules here. See:
http://www.w3.org/TR/CSS21/tables.html#propdef-border-spacing
See for yourself, IE is not applying the 50px padding here:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"
http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Demo</title>
<style type="text/css">
TABLE { border: 1px solid #f00; padding: 50px; border-spacing 15px;
background-color: #ff0;}
TD { border: 5px solid #0f0; background-color: #0ff;}
</style>
</head>
<body>
<table>
<tr><td>Alpha</td><td>Bravo</td><td>Charlie</td></tr>
<tr><td>Alpha</td><td>Bravo</td><td>Charlie</td></tr>
<tr><td>Alpha</td><td>Bravo</td><td>Charlie</td></tr>
</table>
</body>
</html>
