Vertical align inside div, vertical-align: middle not working?

You can do this only by padding, because other two ways line-height and vertical-align can't work on img.

You can do this only by padding, because other two ways line-height and vertical-align can't work on img.... Write #logo { padding: 20px 0; } 20px can be anything as you require.

This worked but I consider this kind of a hack, just don't understand why vertical-alig:middle is not working. – Chuchelo Dec 3 at 7:05 I am good with css, but still face this things many time, vertical-align don't fulfill our requirement at many places – Sonal Khunt Dec 3 at 7:12 @Chuchelo: It's not a hack as there is no such thing as vertical align for this situation because it's only intended for inline elements. Search SO for vertical align css and you will find thousands of explanations and workarounds?.

– Sparky672 Dec 3 at 16:01.

Do this #header {display:table;} #logo {display:table-cell; vertical-align:middle;} Reference.

It went to top right of the header now. – Chuchelo Dec 3 at 6:46 please make a fiddle on jsfiddle. Net – diEcho Dec 3 at 6:48 Your solution will not work in older versions of IE.

– Sparky672 Dec 3 at 16:02 you need to use CSS hack for that – diEcho Dec 3 at 16:14.

Another option, although it has its limitations: The negative margin should be half of the image height. So the following image will center in the above HTML: This makes the centering dynamic if you happen to have a div that changes height. It can get a little tricky with the relative positioning though, because the image is taken out of the normal layout flow.

Shoot, by the time I submitted this I hadn't seen Pedro's response. I wish I could delete my answer easily :-) – Nathan Fox Dec 3 at 7:22.

Logo { position: absolute; top: 50%; margin-top: -75px; } Common method of doing vertical alignment. With top being 50% and margin-top being negative half the dimension of the parent div.

1 Of course parent dive has to be assigned style of position: relative; – Tadeck Dec 10 at 16:36.

It's a position:absolute; not a absolute. – MR.T. K Dec 3 at 7:15 @MR.T.K, thanks. Fixed it.

– Inuyasha Dec 3 at 15:55 @lnuyasha: Also style="relative" should be replaced with style="position: relative", doesn't it? – Tadeck Dec 10 at 16:35.

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.