Vertical-align does not line li's

Navigation
2

Guys, I have a problem with the use of vertical align. My <li> of the start menu is 80px in height and set to align in half. It just does not work, huh.

link

    
asked by anonymous 28.11.2014 / 15:17

3 answers

1

Change the display from .headercontainer li to table-cell . 

.headercontainer li{
    display:table-cell;
    height:inherit;
    vertical-align:middle;
}

Example : link

    
28.11.2014 / 15:22
1

Suggestion: 

.headercontainer li {
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);

The transform: translateY(-50%); is to correct the position, otherwise it would be 50% + height of the element.

jsFiddle: link

    
08.12.2014 / 21:56
0

Add line-height: 80px in element li. I leave here the fiddle: link

    
28.11.2014 / 15:19
Access a certain line of the variable UPDATE, field with placeholder query failed to execute