Вертикальное выравнивание

программирование html css веб дизайн верстка

Не могу выровнять вертикально текст относительно картинки. Имеется такая структура:

<div class="large">
<ul class="nav">
<li><a href="">УСЛУГИ</a></li>
<li><a href="">ПРОЕКТЫ</a></li>
<li><a href=""><img src="image/logo.png" alt="Логотип"></a></li>
<li><a href="">БЛОГ</a></li>
<li><a href="">ОТЗЫВЫ</a></li>
</ul>
</div>

css:
.large {
display: block;
}

.nav {
display: inline-block;
}

.nav li {
display: inline-block;
float: left;
margin-left: 50px;
}

.nav img {
vertical-align: middle; /* этот участок не выравнивает текст по вертикали относительно картинки */
}

Примечание:
.nav a {
display: block;
}

Примечание:
Вариант с margin неплох, но возможно есть еще какой-нибудь способ заставить выравниваться?

Примечание:
holden321, мужик, спасибо!
Ответы:
попробуйте margin-top, margin-bottom
Если float убрать, то vertical-align у img будет работать.
http://jsfiddle.net/holden321/k2aMS/


10 лет назад

RPI.su - самая большая русскоязычная база вопросов и ответов. Наш проект был реализован как продолжение популярного сервиса otvety.google.ru, который был закрыт и удален 30 апреля 2015 года. Мы решили воскресить полезный сервис Ответы Гугл, чтобы любой человек смог публично узнать ответ на свой вопрос у интернет сообщества.

Все вопросы, добавленные на сайт ответов Google, мы скопировали и сохранили здесь. Имена старых пользователей также отображены в том виде, в котором они существовали ранее. Только нужно заново пройти регистрацию, чтобы иметь возможность задавать вопросы, или отвечать другим.

Чтобы связаться с нами по любому вопросу О САЙТЕ (реклама, сотрудничество, отзыв о сервисе), пишите на почту [email protected]. Только все общие вопросы размещайте на сайте, на них ответ по почте не предоставляется.