Lack of interest Get rid of old school vertical aligning technique

This suggestion has been closed automatically because it did not receive enough votes over an extended period of time. If you wish to see this, please search for an open suggestion and, if you don't find any, post a new one.

CyberAP

Well-known member
Right now header logo is centered with a help of line-height. But it's value is fixed. That's not really good if we go responsive.
So the way to improve it is to use a pseudo-element fix.

Here is how:

  • Remove line-height property
  • Add an after pseudo for #logo block and center it vertically
CSS for the pseudo-element:

Code:
#logo:after
{
  content: "";
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}
 
Upvote 2
Top