Я не могу центрировать содержимое div - PullRequest
Новая
       24

Я не могу центрировать содержимое div

0 голосов
/ 12 февраля 2012

Это моя скрипка: http://jsfiddle.net/7UwD2/

Я перепробовал все, что нашел в Интернете - настройка:

margin: 0px auto; с width, но это не работает.

Только если я добавлю атрибут: text-align: center; к классу head-title, который он центрирует, - но только текст, изображение все еще находится в левой позиции.моя проблема?

1 Ответ

2 голосов
/ 12 февраля 2012
  • Удалить float с изображения,
  • используйте text-align: center на внешнем DIV,
  • использовать SPAN вместо внутреннего DIV,
  • применить vertical-align: middle к изображению и SPAN

HTML: 

<div class="head-title">
    <img class="list-icon" src="...">
    <span>Menu</span>
</div>

CSS: 

.head-title {
    width: 150px;
    height: 26px;
    padding: 5px;        
    text-align: center;
}

.head-title > * {
    vertical-align: middle;
}

.list-icon {
    width: 24px;
    height: 24px;
}

Демонстрационная версия: http://jsfiddle.net/7UwD2/6/

...