cFA wrote:

Hi Folks, being a standards geek and being taught that way I didnt learn
anything about tables (for layout),

I think that is awesome...

and hadnt any occassions where tabular
data was needed.

...but it's unfortunate you never got any practice with data tables.

However I'm now working on a site where it is and I'm
having a bear of a time trying to get rid of space around images in td's.

First prob is in IE 5 - 6 PC I get a ton of horizontal space to the right of
my images.

FF, etc is fine on the horizontal and shrinks to fit.

After a brief glance at this, I'm not sure what it is or how to fix it. Perhaps using col elements and setting widths on these would help?

Second is that I do have a small bit of padding on top and bottom of the
images cross browser. This is coming from my

table.legend th, td {
padding: .5em;
border-right: 1px solid #ddd;
border-bottom: 1px solid #ddd;
}

I have tried to eliminate it by writing:

table.legend td.icon {
background: #000;
padding: 0;
width: 30px;
height: 20px;
}

but this is a no go.

This is because the height of the first cell is dependent on the height of the other cells in the row. Whichever cell is tallest makes the other ones follow suit. Each of the cells with text in it have to be 32px high at the default font size of 16 pixels, so the icon cells have to be this high too.

I read about table img probs and tried to apply as well:

td img {
display: block;
vertical-align: bottom;
}

which is also a no go.

I would really like the image tds to be shrink to fit and retain the
padding: .5em; for everything else. or at the least have the td.icon have
the same .5em padding.

But even if you could do this, which you can't, your rows would be uneven with the first cell in the row being shortter than the rest. This would look pretty goofy, like this:

-------------------------------------------
| X |  Correct                    | 1 | 1 |
----|                             |   |   |
   ---------------------------------------


Perhaps you actually want something else but are not describing it just right? Maybe pointing us to a graphic mockup of what you want would help us understand better.

http://aenonfiredesign.com/test/tableimg/

Zoe

--
Zoe M. Gillenwater
Design Services Manager
UNC Highway Safety Research Center
http://www.hsrc.unc.edu

______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to