Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > Вёрстка веб-сайтов > Элемент списка: выровнять текст по центру маркера

Автор: AXS 7.4.2011, 12:06

Список сделан так:

Код


<ul>
  <li>123456</li>
  <li>qwerty</li>
  <li>фывапр</li>
</ul>

Код


li {
  list-style-image: url('cover/main/images/m_phone.png');
  list-style-position: inside;
}

Картинка маркера 25*25 пикселей и контейнер <li> растягивается до её (картинки) размера, а текст выровнен по нижней его (контейнера) части... Как сделать текст по центру маркера?

http://bloggu.ru/list.html - здесь пример. Для наглядности 3 элемента обвёл бордером.

Автор: bars80080 7.4.2011, 14:01

vertical-align: baseline; - не поможет?
попробовать его для li

Автор: AXS 7.4.2011, 14:11

Цитата(bars80080 @ 7.4.2011, 14:01)

vertical-align: baseline; - не поможет?
попробовать его для li

vertical-align к сожалению не влияет никаким образом на <li>

Автор: SelenIT 7.4.2011, 14:14

Имхо, лучше (надежнее, кроссбраузернее) всего отказаться от list-style-image и поставить картинку фоном (как надо и куда надо).

Автор: AXS 7.4.2011, 14:58

Похоже что так и надо сделать... Просто list-style-image мне казалось более изящным решением.
А поддерживается всеми браузерами (IE 6, 7 я не беру в расчёт - пользователи этих мамонтов будут видеть сообщение об устаревании их браузеров и ссылки на дистры всех свежих браузеров)

Автор: bars80080 7.4.2011, 19:04

Цитата(AXS @ 7.4.2011, 14:58

)

IE 6, 7 я не беру в расчёт - пользователи этих мамонтов будут видеть сообщение об устаревании их браузеров и ссылки на дистры всех свежих браузеров

после чего эти клиенты уйдут с твоего сайта и более никогда не вернутся

Автор: AXS 7.4.2011, 22:47

Цитата(bars80080 @ 7.4.2011, 19:04)

Цитата(AXS @ 7.4.2011, 14:58

)

после чего эти клиенты уйдут с твоего сайта и более никогда не вернутся

Возможно, но это уже тема для другой темы ;)