Пустой div в родительском элементе должен выглядеть так же

Question

Если вы видите следующее jsfiddle, элементы div a, у которых нет текста, появляются на уровне, отличном от тех, которые имеют текст.Есть ли способ с CSS, чтобы они появлялись в ряд независимо от того, присутствует ли текст?(без изменения разметки).

Я установил элементы ссылки в виде блока, чтобы они были одинаковой высоты, если какой-либо текст ссылки был пустым

http://jsfiddle.net/ch9Ax/

Answer 1

Добавление vertical-align:top; к правилу #bzm .button исправлено в моем тестовом браузере

Answer 2

Добавьте высоту: 27px к кнопке bzm.button :) Это обеспечит одинаковый размер, с содержимым внутри или без него.

#bzm .button {
display: inline-block;
width: 90px;
height:27px;
}

Answer 3

Проблема в

#bzm .button {
    display:inline-block;
    width: 90px;
}

В зависимости от

#bzm .button {
    float:left;
    width: 90px;
}

И стиль соответственно.

Пример: http://jsfiddle.net/jasongennaro/ch9Ax/14/

Answer 4

Используйте атрибут float css вместо display: inline-block для класса .button.

т.е.:

#bzm .button {
display: inline-block;
width: 90px;
}

до

#bzm .button {
float: left;
width: 90px;
}

Рабочий пример:http://jsfiddle.net/ch9Ax/12/