Note the 'Windows Server 2003' logo. I need this vertically aligned, so that it's in the center compared to the Windows XP logo on the right.

I cannot for the life of me figure this out. While I've found 101 ways to vertically align an image (which by the way which is the 'correct' way?!), none have worked for me in this instance. I assume that the current classes have something to do with that, but either way I am stumped.

Please save my sanity and help.

Thank you

01-29-2014, 08:30 PM

rtrethewey

The vertical-align property is for non-replaced inline elements. The alignment is relative to the line-boxes created by the block-level containing element, so in situations like this, you have to set the 'line-height' property of the containing element to control the effect.

Thanks rtrethewey. Seems so over complicated, plus while I can see this working in codepen (but setting vertical-align:middle), it doesn't work in dreamweaver, as in the Windows server 2003 logo still will not vertical align middle.

I think I may just combine logos in to one and be done with it.

Thanks again for your help.

01-31-2014, 09:21 AM

dupy

I should add, I mean over complicated for the seemingly simple task that this is (not your code). With HTML, I could bung this in a table within a minute and have it looking exactly as needed, although I now know that is naughty, but sometimes essential for those who are used to building with wysiwyg's. I've literally spend a whole day trying to achieve the same in CSS.