Ian Young wrote: > Moving on from yesterday's vertical align div, I have set up code to > vertically align images in a wrapping div. > > That's fine. However, images which are larger than the div and which > normally would be controlled by overflow:hidden, now spill over.
They don't spill over - they expand the table-cell just as in an ordinary HTML table. That's how a CSS table cells is supposed to behave - it replicates its HTML counterpart, and you can't prevent it by declaring 'overflow: hidden' since the cell expands _before_ hiding any overflow. > http://www.iyesolutions.co.uk/templates/whitehousestudios/aerial.html > You have two options: 1: set a max-height and max-width on the image and let browsers scale over-sized ones down to a suitable size for your layout. 2: wrap a container of suitable size around the image and hide the overflow on that. You will of course lose vertical alignment of the image then. I often use option 1: - regardless of whether images are in a 'table-cell' or not, which works everywhere but in IE6. However IE6 doesn't understand CSS table so one can hide the overflow in that old bugger. regards Georg -- http://www.gunlaug.no ______________________________________________________________________ css-discuss [[email protected]] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
