Vertically Aligning text adn strange IE issue

Sounds like a simple question but as yet I've been unable to find an answer anywhere that satisfactorally answer the question: how do you vertically align text (or any content) to the bottom of its containing element?

I have a 'cell' which contains and image and text that wraps around the image, however the image is a lot taller than the text and I want the text to align to the bottom of the 'cell'.

http://www.hazelryan.co.uk/ItalianWorld/template.htm

And the IE issue... just look at the page in IE and you'll see what I mean ;) Never seen that in my life and probably couldnt recreate it if I tried...

Another issue is that in firefox the page is incredibly slow... not in the load times but in rendering, like if you resize the browser or minimise it then open it up again it 'lags' same with the scrolling... any ideas?

Have you tried the auto margin for firefox and vertical-align for IE?

I've vertical-aligned, positioned relatively with bottom 0, I've scrapped the whole thing and started again and it still will not bottom align.

I've finally got it to work in opera and ff using display:table-cell but that doesnt work in IE and IE is the only one it really matters in.

well I guess semantically incorrect as they may be, tables are the only way to do this :(

I beg to differ. You can always add margin or padding or use position relative. vertical-align only works on inline elements. So is the height of the area that has the text ever going to change?

Position relative didnt work, I tried it and since the content of the cell will be of variable length I cant add margins or padding without affecting the height of the cell. Setting the bottom margin or padding to 0 and the top to auto also doesnt work.