Forum Moderators: open
I am creating a website layout with tables, however I am running into a small issues.
I never had this problem when I did not use a doctype on my pages in (any browser) however since I have been using a doctype, this issue has been coming up.
I have a table that has several nested tables in it. In IE the table height is nice and tight with all of the images in side, Everything looks great,
However, When I look at it on Netscape the table seems to get a lot larger (in height) and you see a lot of extra dead space between the images (only in height).
Like I said this was never a problem before when I did not use a doctype, but know that I am, this is becoming a problem.
Thanks
Chad
Check this post, message #3
[webmasterworld.com...]
In short, the standard default for images in table cells is that they are rendered "display:inline;". This means they are aligned with the text baseline for the cell. Even though you may not have text in the cell, the theoretical baseline is still positioned there in the rendering engine.
You are used to seeing the image aligned (non-standardly) with bottom of the cell, but the baseline is not all the way at the bottom - it leaves a gap for the descenders on the various characters that extend below the baseline in most lowercase fonts (g,j,p,q,y). Hence the gap you are seeing in your table cells when their contained images are rendered in standards mode.
The thread referenced above discusses a couple of approaches to making it work the way you intend.
Thanks for everything. One question, I added the CSS script like you said and it still did not work, however I did figure out something. For some reason if I add an image into the table and align the image to the the center, the table, became a lot larger. like before, (Added space)
However when I made the table size (width) smaller and did not align the image inside it and just set it in, the table stayed the same size in IE, & Netscape.
This is a new one for me, Any thoughts
Thanks