it-swarm.com.ru

Пули центр с неупорядоченным списком

Кто-нибудь знает CSS, который заставляет точку маркера находиться на вершине многострочного маркированного списка? По какой-то причине с шаблоном, в котором я использую точки с маркером в центре, вместо того, чтобы просто сидеть рядом с первым Словом, если у меня более одной строки текста.

24
Logan

Установите позицию стиля списка внутри элемента списка, см. эту демонстрационную скрипку.

CSS:

ul {
    list-style-position: inside;
}
52
NGLN

Это не сам по себе ответ, но он может дать другим понимание аналогичной визуальной ситуации с другим набором обстоятельств.

У меня была такая же проблема, вот так:

 Bullet centered in text block

Мой HTML выглядел так:

<ul>
    <li>
        <a href="#">Link with several lines. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Mollitia, commodi!</a>
        <p>Lorem ipsum dolor sit amet.</p>
    </li>
    <li>
        <a href="#">Link with several lines. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Mollitia, commodi!</a>
        <p>Lorem ipsum dolor sit amet.</p>
    </li>
</ul>

И CSS, как это:

a {
    display: inline-block;
    vertical-align: middle;
}

Видите оскорбительную часть? Объявление vertical-align: middle;.

Есть два решения:

Решение 1

Удалите объявление vertical-align: middle; полностью.

Решение 2

Измените значение: vertical-align: middle; на vertical-align: top;.

Результат (как и ожидалось в начале):

 Bullet top aligned

Надеюсь это поможет.

0
Ricardo Zea