Posted by Els on 01/13/06 15:16

David Graham wrote:

>> Yup. Default for td's content (whether image or text) is left and
>> middle aligned, while you can't vertically center content in a div
>> other than by setting explicit top and bottom margins or using
>> position:absolute with explicit negative margins.
>>
> Understood you until you mentioned a need for 'explicit negative margins' -
> not sure what that is for - could you put it into simple terms for a
> learner - thanks again.

By explicit I meant stipulated in pixels.
You could give the containing div a fixed height, then position the
image absolute on left:50% and top:50%, but that would be the position
of the top left corner of the image, so then you set a negative top
margin of height/2, and a negative left margin of width/2.

Say your div is 200px high and 200px wide, and your image 150px high
and 80px wide, you would use CSS like this:

div{
position:relative;
height:200px;
width:200px;
}
div img{
position:absolute;
top:50%;
left:50%;
margin-top:-75px;
margin-left:-40px;
}

Meaning you still need to know the measures of the image, while with
TDs, you don't.

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -

[Back to original message]