Горизонтальный заказанный список (и IE)
Вы должны всегда пытаться подрезать селекторы, сделать их как можно более тонкими.
как селектор, вы должны использовать:
Этот селектор будет точно соответствовать className:
xpath('//div[@class="ellipsis _1ha3"][x]')
или
Этот селектор будет соответствовать классу элементов, где он содержит эти символы:
xpath('//div[contains(@class, "ellipsis _1ha3")][x]')
- x - это положение найденных элементов dom, начинается с 1, ([1] выберет первый случай и т. Д.).
7 ответов
Этот код работает во всех браузерах, которые я тестировал. Если вы еще не нашли ответа, то предположение о самом популярном ответе действительно. Просто отрегулируйте ширину, если хотите, чтобы он был обтеканием.
<ol style="list-style-type:decimal; width: 600px;">
<li style="float: left; width: 200px; padding: 2px 0px;">Test</li>
<li style="float: left; width: 200px; padding: 2px 0px;">Test</li>
<li style="float: left; width: 200px; padding: 2px 0px;">Test</li>
</ol>
ol.horizontal{
list-style-type: decimal;
width: 600px;
}
ol.horizontal li{
float: left;
width: 200px;
padding: 2px 0px;
}
<ol class="horizontal">
<li>Test</li>
<li>Test</li>
<li>Test</li>
</ol>
Я попробовал каждый display свойство на этой странице и ни один из них не сохраняет заказанные числа списка при отображении списка горизонтально в IE (и при этом они не сохраняются в Firefox, Opera или Safari для Windows - и следовательно вероятно, Google Chrome, хотя я признаю, что не протестировал каждый display свойство там).
Единственное решение, что (частично - только в Firefox) работы ответ W Al.
Я думаю, хотите ли Вы горизонтальный пронумерованный список, Вы оказываетесь перед необходимостью генерировать его на сервере или управлять списком на клиенте, использующем JavaScript, чтобы повторно вставить числа.
Можно ли использовать этот CSS?
li {display: inline}
Править: Это не сохраняет нумерацию объекта, и я не знаю ни о каком методе, который делает. Как замена, я предполагаю все, что можно сделать, вставка числа вручную, пока браузеры не получают лучшую поддержку счетчиков CSS.
Хорошо, вам нужно добавить в CSS атрибут float, width и list-style-type. Выглядит так:
li{
float:left;
width:50px;
list-style-type:decimal;
}
Гушикен
Вы не можете установить ширину на встроенных элементах. таким образом, я обычно заканчиваю тем, что пустил в ход их вместо этого
li
{
float: left;
width:30px;
}
Я нашел эту страницу о IE hasLayout полезной. Включает обсуждение такого форматирования списка (ссылка указывает на раздел списков на странице)