Недавно в мою службу поддержки поступил вопрос о том, как вертикально выравнивать маркер списка . По умолчанию, он находится где-то вверху. В итоге, если элемент списка многострочный, это может испортить дизайн. В этом материале я расскажу, как сделать вертикальное выравнивание маркера списка .
Недавно в мою службу поддержки поступил вопрос о том, как вертикально выравнивать маркер списка. По умолчанию, он находится где-то вверху. В итоге, если элемент списка многострочный, это может испортить дизайн. В этом материале я расскажу, как сделать вертикальное выравнивание маркера списка.
Начнём с того, что вот эту конструкцию сразу забудьте (если хотите выравнивать по-вертикали):
ul {
list-style-image: url("marker.png");
}
Вместо этого нужно просто поставить фон у каждого li. Причём этот фон надо спозиционировать слева и посередине (как раз слева находится маркер, а выравнивание по-середине - это и есть вертикальное выравнивание):
ul li {
background: url("marker.png") no-repeat left center;
}
Вот и всё. Проще, на мой взгляд, некуда, поэтому можете смело использовать эту технику для выравнивания маркера списка. Безусловно, есть и масса других способов, но, в основном, они "кривые", хоть и рабочие. Если у Вас есть мысли по тому, как решить эту задачу ещё проще, оставляйте их в комментариях.
