Vertical alignment in tables

CSS for positioning a logo in a cell

[Tricky_9999]

Hi there

I asked this question yesterday, but have had no joy (probably because I was asking in the wrong part of the forum) but I need to know how to vertically align a logo to the top of a table cell through CSS - when trying to validate in 4.01 strict, valign isn't allowed, so I need an alternative if possible.

I've stripped all the deprecated tags out of the html and the page is now validating in 4.01 strict without the 'valign' tag, but on pages where the size of the content causes the cells stretch, the logo centres vertically instead of aligning to the top of the cell. Help - its driving me mad!

Thanks a lot

Tony

[benihana]

try giving the tablecell a class, and put this in your css:

.myTableClass {
vertical-align:top;
}

ben

[pageoneresults]

I'll usually create three generic classes for vertical alignment...

.vab{vertical-align:bottom;}
.vam{vertical-align:middle;}
.vat{vertical-align:top;}

This way you can use them on various elements where required.

[Tricky_9999]

Thanks for the responses - I had tried listing a class with {vertical-align: top;} previously, but tried it again as you suggested in case I made a mistake in the syntax, but for some reason, it doesn't render when I view the page in my three default browsers (IE6, Netscape 7 and Firefox).

I think the root of the problem is down to how many stupid tables are nested - I've counted 10 on a page with only 129 lines of code! Having said that, I've only been working on the site locally, and before I started stripping the deprecated html and putting the formatting in CSS, the original designer had managed to make it work fine on the live site (see my profile). By the way, view the code and see what a nightmare trying to 'fix' this site is!

I think I must be missing something really obvious, but I'm really struggling, so anything else you could suggest would be really appreciated.

Cheers

Tony