Переполнение CSS: скрыто, скрывая маркеры списка? - PullRequest
Новая
       17

Переполнение CSS: скрыто, скрывая маркеры списка?

24 голосов
/ 30 января 2011

Я только что заметил что-то смешное. Допустим, у меня есть список HTML: 

<ol>
    <li>Lorem</li>
    <li>ipsum</li>
    <li>dolor</li>
    <li>sit amet enim. Etiam ullamcorper. Suspendisse a pellentesque dui, non felis. Maecenas malesuada elit lectus felis, malesuada ultricies. Curabitur et ligula.</li>
</ol>

А это CSS: 

li {
    white-space: nowrap;
    overflow: hidden;
}

Длинный текст в последнем элементе действительно удаляется, когда он выходит за пределы контейнера, как и ожидалось. НО! Номера элементов списка также зависят от свойства overflow и не отображаются.

Однако, изменив CSS следующим образом: 

ol {
    overflow: hidden;
}
li {
    white-space: nowrap;
}

работает как задумано (текст не выходит из контейнера, но отображаются элементы списка). По крайней мере, все это верно для Firefox 4 beta10.

Не думаете ли вы, что нумерация, на которую воздействует overflow, немного нелогична? Почему это случилось? Это намеренное поведение? Это в спецификации или просто какая-то странность, с которой кто-то забыл разобраться?

Ответы [ 3 ]

40 голосов
/ 30 января 2011

Насколько мне известно, это стандартное поведение, если list-style-position равно outside, маркеры ul и числа ol не отображаются. По крайней мере, в Firefox, я помню его раньше в старых версиях.

1 голос
/ 30 января 2011

Браузеры добавляют поля по умолчанию и отступы в списки. Попробуйте сначала использовать файл reset.css, чтобы удалить стили по умолчанию, чтобы вы могли начать чистоту и свежесть без неожиданного поведения. Выполните поиск сброса Эрика Мейера. Надеюсь, это поможет.

0 голосов
/ 30 января 2011

Я видел, как мои маркеры / числа обрезаются, когда на левой стороне ул. Недостаточно заполнения.Попробуйте добавить немного и посмотреть, поможет ли это.

...