Sunday, August 28, 2005, 12:36:38 AM, t94xr.net.nz wrote:
> Whats an easy way to align an image in the centre of a 150px div?
Horizontally? Give the DIV text-align:center;
Vertically? As with all vertical centering, it's a bit more tricky:
I use display:table-cell for CSS2 browsers and a font-size setting for IE.
.imgDiv {
width:200px; height:200px;
text-align:center;
display:table-cell; /* table-cell version */
vertical-align:middle;
}
* html .imgDiv {
font-size:178px; /* number depends on box height, tinker with it */
}
* html .imgDiv img {
vertical-align:middle; /* inline version of vertical-align */
}
Demo: http://mrclay.org/web_design/centered_image/
Steve
--
http://mrclay.org/ : http://frenchhorns.mrclay.org/
______________________________________________________________________
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/
