Межстрочный интервал в списке

[jas0n]

Ну и сразу к делу:

XHTML:

<ul class="menu_spisok">
<li class="menu_spisok"><a href="#empty-anchor" class="menu_spisok">Главная</a></li>
<li class="menu_spisok"><a href="#empty-anchor" class="menu_spisok">О компании</a></li>
<li class="menu_spisok"><a href="#empty-anchor" class="menu_spisok">Лицензии</a></li>
<li class="menu_spisok"><a href="#empty-anchor" class="menu_spisok">Проектные услуги</a></li>
<li class="menu_spisok"><a href="#empty-anchor" class="menu_spisok">Проектные решения</a></li>
<li class="menu_spisok"><a href="#empty-anchor" class="menu_spisok">Контакты</a></li>
</ul>

и CSS:

ul.menu_spisok {
  display: block;
  position: absolute;
  list-style-type: none;
  margin: 0;
  padding: 0;
  left: 68px;
  top: 52px;
  z-index: 2;
}

li.menu_spisok {
  padding-top: 10px;
  padding-bottom: 0;
  padding-left: 0;
  padding-right: 0;
  margin-bottom: 0;
  margin-top: 0;
}

В Файрфоксе и IE список выглядит практически одинаково, за тем исключением, что в IE есть смещение относительно положения списка в ФФ где-то на 4 пикселя вверх, неприятно. Но вот в Опере вообще все плохо. Межстрочный интервал визуально существенно меньше, пункты меню приближены друг к другу. В padding-top пробовал указывать и в пискелях, и в пунктах, и в других еденицах измерения, остановился на px, т.к. они дают максимально схожий результата в ФФ и IE. Также пробовал вместо настроек класса для <li> выставлять опцию line-height в свойствах <ul>: выстраиваю точно для ФФ, в Опере и IE — полный завал, расстояние мкжду пунктами списка выходит значительно шире: в Опере больше, в IE ище больше. Никакие ухищрения с вариациями едениц, в кот. указывались отступы не помогали. Пэддинги и маргины занулены для того, чтобы наверянка избежать ненужного пространства. Может быть это излишнее, подскажите пожалуйста насчёт этого тоже.

А вот соответственно и скриншоты того, как это выглядит в различных браузерах:

Mozilla Firefox 2.0.0.17

Google Chrome 0.2.149.30 (2200)

Safari под Windows 3.1.2 (525.21)

Opera 9.52

Internet Explorer 7.0.5730.13

Как видите, наиболее совпадают результаты Firefox + Google Chrome и седьмого IE, наихудший результат у Оперы (маловероятно что в версии 9.60 что-то будет выглядеть по другому). Если padding-top указывать в пунктах (pt) а не пикселях разнобой начинается уже во всех брузерах.

Edited October 18, 2008 by jas0n

[yopopt]

Выложите куда-нибудь в сеть, чтобы было удобнее посмотреть и что-то подсказать.

[narby]

советую переверстать используя другой подход!

З.Ы. верстка изначально не правильная... обычно делается все под оперу\фокс а потом уже все крывости подравляют на IE с применением другого набора цсс....

Edited October 18, 2008 by narby

[klierik]

установите фиксированную высоту для <li>

а <a> позиционируйете через vertical-align

[jas0n]

Спасибо, klierik, отличный вариант. Как только выставил height вместо padding'a сразу практичечески во всех элементах межстрочный интрвал выровнялся, только в Опере было на 2 пикселя ниже, чем в ФФ и IE. По эксперементировал с vertical-align, выставил значение «top», в Лисе и Ослике списки не сдвинулись с места, а в Опере список как раз подвинулся на эти самые 2 px. Идеально. Это уже что-то из разряда хаков прямо, т.к. Опера получается как-то по своему понимает это значение при том, что FF и IE вообще не отреагировали на его введение. Вы навскидку или знали уже про такую особенность vertical-align?

Yopopt, спасибо за помощь, но вариант klierik уже сработал для меня.

Edited October 18, 2008 by jas0n