Vertical-align a variable-size image in a div?

You can't use vertical-align on a block element. An image is usually an inline element, but you have yours explicitly set to display: block Remove that, and set the line-height of the parent div to the div's height Works here: jsfiddle.net/YnzR9/1 image { width: 75px; height: 100%; float: left; line-height: 110px; text-align: center; } #image img { vertical-align: middle; }.

You can't use vertical-align on a block element. An image is usually an inline element, but you have yours explicitly set to display: block. Remove that, and set the line-height of the parent div to the div's height.

Works here: jsfiddle.net/YnzR9/1/ #image { width: 75px; height: 100%; float: left; line-height: 110px; text-align: center; } #image img { vertical-align: middle; }.

Now the image doesn't center horizontally, still doesn't center vertically, and my lines of text are huge (due to each of them having a 110px line-height). Maybe I'm understanding wrong? – Kevin Aug 1 at 21:04 You were centering it using margin: auto, which doesn't work on inline elements.

Instead, use text-align: center on the parent element. Fixed here: jsfiddle. Net/YnzR9/1 – gilly3 Aug 1 at 21:07 Thank you very much!

– Kevin Aug 1 at 21:07 A note to anyone reading this, the whole reason it didn't work for me is because I was using DOCTYPE TRANSITIONAL. Which no change in HTML or CSS whatsoever, switching to DOCTYPE STRICT made it work. This is true for at least Chrome, FF, and IE8.

– Kevin Aug 2 at 4:14.

Set the "line-height" of the div to the same value as the height of the div. Update: Assuming you want the image vertically aligned and centered, use the following. #image { width: 75px; height: 110px; float: left; line-height: 110px; text-align:center; } #image img { vertical-align: middle; }.

This doesn't fix anything: #image { width: 75px; height: 110px; line-height: 110px; float: left; } – Kevin Aug 1 at 20:55 You didn't say which div to put the line-height in, I think I tried them all and nothing worked. – Kevin Aug 1 at 20:57 gilly3 mentions that the display:block negates the line height. Assuming you want the image vertically aligned and centered, see updated post.

– pdubs Aug 1 at 21:11.

I cant really gove you an answer,but what I can give you is a way to a solution, that is you have to find the anglde that you relate to or peaks your interest. A good paper is one that people get drawn into because it reaches them ln some way.As for me WW11 to me, I think of the holocaust and the effect it had on the survivors, their families and those who stood by and did nothing until it was too late.