Centering vertical

HTML & CSS
1

I have a layout using this PO’s table/table-cell method. In the header i have a logo on the left side:

#logo {
  width: 23.36448598130841%;
  float: left;    
}

#logo img {
  max-width: 100%;
  height: auto;    
}

and a menu on the right side:

#menu {
  float: right;
  list-style: none;
  vertical-align: middle !important;    
}

But the menu isn’t centering vertical. What should I do tp have the menu vertically align without using a hight for the header?

2

Don’t float them. Nest another table/table-cell inside of that (the two columns, #logi and #menu being the table-cell.)

3

Hi Ryan. Thank you for the reply. And then text align left and right you mean?

4

On the #menu you’ll probably need text-align:right; but you can leave #logo alone (i.e. you don’t need text-align:left.)

Just get the structure and go style it after :slight_smile: .

1 Like
5

Hi Ryan. Thanks works as a charm. :slight_smile:

6

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.