I have a table as follow:
<table>
<tr>
<td>
*PROBLEMATIC CELL*
</td>
<td rowspan="2">
</td>
<td rowspan="3">
</td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td colspan="2">
</td>
</tr>
</table>
The first cell of the first row, has a padding at the bottom. Well it’s not really padding but it looks like padding and using firebug I can not find what the space there actually is.
I think what is happening is that, firefox automatically adjusts the bottom padding of the first td in the first tr with the padding top of the first and only td of the second tr.
p.s. works perfectly fine in Chrome.
Basically what I am trying to achieve is for the height of the first td in the first tr, to be only as tall as required but not taller so that the content of that cell ends on the same place as where the td ends without any space between them.
The website URL is: http://mmamail.com/
It seems to have something to do with the padding-top placed on the first TD of the SECOND TR. The weird thing is that it works nicely on chrome.
if you are referring to the space in between the “Monthly poll” and “Monthly Magazine” boxes, it is not caused by padding…
What’s happening is the
tdcontaining the flash video is too tall, and because it has arowspanof 2, the twotds on the left are being adjusted to the height of the tallesttd(aka the video box)One solution is to add another
trbelow the first 2 rows,let it have an empty
td,change the rowspan of the video box to 3
And then the redundant space you see in between the first 2 boxes will be transfered to the empty
tdyou have just created.OR
I would suggest you bite the bullet and start using CSS rather than tables for layout, purely because: