Как вертикальное выравнивание по середине, для до содержимого лимита

Я хочу, чтобы выравнивание по вертикали, li:before содержимое, без использования поля, я попытался включить vertical-align: middle; в ul.nav-menu-list li:hover:before, .nav-menu-list li:focus:before, но он не работает.Как вертикальное выравнивание по середине, для до содержимого лимита

пыльник мой код или JSFiddle here:

.nav-menu-list>li>a { 
    font-family: 'Pribambas', Helvetica, Roboto, Arial, sans-serif; 
    font-size: 24px; 
    font-weight: normal; 
    line-height: normal; 
} 

ul.nav-menu-list li a { 
    border-bottom: none; 
    padding-left: 60px; 
    color: #fff; 
} 

ul.nav-menu-list li:hover:before, .nav-menu-list li:focus:before { 
    content: '-'; 
    display: block; 
    width: 15px; 
    height: 3px; 
    background-color: #fff; 
    clear: both; 
    vertical-align: middle; 
} 

ul.nav-menu-list li a:hover, ul.nav-menu-list li a:focus { 
    background-color: transparent; 
    color: #a2a2a2; 
}

источник

2015-02-15 Valeri Crudu

Конечно, он не работает, потому что 'vertical-align' не применяется к элементам' block'. – CBroe

Редактировать Я просто вижу, что вы не хотите использовать маржу. Ну я попробовал :)

Это будет работать, как вы хотите работать, просто установить дисплей на встроенный блок и дать ему маржин-дно 6px: http://jsfiddle.net/bayxxey3/8/

ul.nav-menu-list li:hover:before, .nav-menu-list li:focus:before { 
    content: ''; 
    display: inline-block; 
    width: 15px; 
    height: 3px; 
    background-color: #000; 
    clear: both; 
    margin-bottom:6px; 
}

источник

2015-02-15 11:45:41 Michelangelo

Прошу прощения, но я немного ошибся CSS, 'content '';' должен быть таким блоком, как здесь [link] (http://jsfiddle.net/bayxxey3/5/), но line- высота не работает –

Другой способ - использовать 'background-image' вместо' content' [link] (http://jsfiddle.net/bayxxey3/7/), для класса 'ul.nav-menu-list li : hover, .nav-menu-list li: focus', но я бы не хотел этого, но я изо всех сил пытаюсь заставить его работать, lol –

@ValeriCrudu Я сделал новую скрипку. Если вы не хотите иметь какой-либо контент, вам нужно рассматривать 'before' как элемент. – Michelangelo

Я хотел бы использовать

.nav-menu-list>li { 
    position: relative; 
} 
ul.nav-menu-list li:hover:before, .nav-menu-list li:focus:before { 
    position: absolute; 
    top: 50%; 
    margin-top: -3px; 
}

достичь вертикальной Align

источник

2015-02-15 16:46:49 Jackson

набор vertical-align: middle; на a, а также, и изменить :before к display:inline-block. Теперь у вас есть два «элемента», как встроенных, так и средних.

vertical-align нужны элементы, работающие вместе для создания выравнивания. Block не играет.

источник

2015-02-15 21:35:18

Как вертикальное выравнивание по середине, для до содержимого лимита

ответ

Смежные вопросы