Подтвердить что ты не робот

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

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

4b9b3361

Ответ 2

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

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

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;.

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

Выровненный по высоте флажок

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

Ответ 3

Вы можете сделать что-то вроде этого:

(css)
li div:before
{
   background-image:url('bullet.png');
}

(html)
<ul>
    <li>
        <div>
            text<br />
            more text
        </div>

    </li>
</ul>