Link to home
Start Free TrialLog in
Avatar of joshkrak
joshkrakFlag for United States of America

asked on

Firefox adding 1px in height to TD

Working on the header and using a table layout. The last cell is a dynamic cap type thing using a repeated space to fill in what the buttons dont take up. This last cell needs a solid 1px border around it. In IE6 is works, but in FF3 (these are the only browser I have to test on) it is adding 1px in height to the cell.. How can I get FF3 to make the cell the same height as the others. I don't have a problem with removing the table for divs if you can give me the working HTML with style included. Here is the current HTML I am using.

The page with the bug is live @ http://www.alolha.com


<div> <!-- NavBar -->
                    <table cellpadding="0" cellspacing="0" style="border-collapse:collapse;">
                        <tr>
                            <td><a href="PicGallery.aspx"><img src="Images/MasterPage/btnGallery.png" alt="Gallery" border="0" /></a></td>
                            <td><a href="PicPage.aspx"><img src="Images/MasterPage/btnPics.png" alt="Pics" border="0" /></a></td>
                            <td><a href="PicUpload.aspx"><img src="Images/MasterPage/btnUpload.png" alt="Upload" border="0" /></a></td>
                            <td><img src="Images/MasterPage/btnMyPics.png" alt="MyPics" /></td>
                            <td style="width:100%; background-image:url('Images/MasterPage/RightNavSpacer.png'); border:solid 1px black;"></td>
                        </tr>
                    </table>
                </div> <!-- End NavBar -->

Open in new window

ASKER CERTIFIED SOLUTION
Avatar of kebabs
kebabs
Flag of Australia image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of joshkrak

ASKER

I did the border left and right and that did do the trick. But I'm also curios as to why it did that in the first place? Just didnt seem right.
The problem was the space that the border occupied acted as an outline (thus being rendered outside the expected region and adding 1-2px height).