@lagudal

Как пофиксить небольшой css баг для списка dl в firefox?

Причем замечено только в FF под Windows 10. В никаких других браузерах баг не наблюдается.
В чем суть. В списке dl есть как положено элементы dt и dd - dd должен начинаться на той же линии что и dt - для этого dt задан float:left. Но если dd выходит за рамки одной строки, он должен переноситься на начало следующей, т.е. всей строки. Везде так и есть, все нормально кроме вот фф под виндовс.
Вот как это выглядит под вин10 фф версия 91.0.2 -

61277fdcb3d64886093664.png

Как видно, некоторые из dd элементов переносятся на вторую строку с большим отступом, длиной равной длине соответстующего элемента dt. При этом, как можно увидеть например в последней 4-й колонке, буквально следующий же элемент переносится нормально.
Если для dt свойство list-style-type удалить совсем или заменить например на decimal, то все встает как надо. Но мне надо именно disc.
Попробовал задать для dd float:left и для dt clear:both, но это не совсем то - тогда если dd полностью не входит в одну строку он целиком перемещается на следующую.
Что упускаю, что можно сделать?
Вживую посмотреть можно здесь, если у кого есть фф под вин 10, гляньте плз.
  • Вопрос задан
  • 62 просмотра
Решения вопроса 1
Pavel-ww
@Pavel-ww
К .list-bullet dt, .product.attribute.overview dt добавьте margin-bottom: -1px;

6127b67da9b02798228892.jpeg

И чтобы красиво было, вместо
.list-bullet dt, .product.attribute.overview dt {
	 margin-left: 20px; 
}

используйте
.list-bullet dl {
	padding-left: 20px;
}

6127b6fd83db8526262347.jpeg
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы