Список li в две колонки (CSS)
Задача: вывести список <ul> <li> в две колонки, используя CSS
Способ решения:
<html>
<head>
<style>
#col li {
display: block;
float: left;
width: 45%;
border: 1px solid #ccc;
}
#col {
margin: 0;
padding: 0;
list-style-type: none;
}
</style>
</head>
<body>
<ul id="col">
<li>Колонка 1</li>
<li>Колонка 2</li>
<li>Колонка 1</li>
<li>Колонка 2</li> </ul>
</body>
</html>
- 0 Гид по «Фотошопу» для чиновников (10.09.2013)
- 0 Twitter Bootstrap Carousel Crossfade (09.09.2013)
- 0 Inline-block vs float (22.08.2013)
- 0 Список li в две колонки (CSS) (13.03.2013) ← вы тут
- Выдвигающаяся из значка форма поиска на сайте (27.11.2017)
- Выравниваем div внутри другого div по центру (27.11.2017)
- Пробелы между пунктами меню (16.11.2017)
- Как убрать placeholder при клике по input (04.11.2017)
- Выравнивание изображения по центру в Bootstrap (11.12.2016)
- Замена текста при наведении на него мышью. События onmouseover и onmouseout (25.03.2016)
- Прилипание блока к верху сайта при его прокручивании (17.02.2016)
- Как сделать какую-либо область на сайте кликабельной ссылкой? (11.08.2015)
- Красивое выравнивание характеристик на странице товара с отступами, отмеченными точками (11.07.2015)
- Сделать слайдер на Owl Carousel c текстом справа (03.02.2015)
- Скролл-эффекты CSS3 и JQuery при прокрутке страницы (13.01.2015)
- Как в iframe показывать только определённую область страницы (04.03.2013)
- Старт видео с определенного времени на Youtube (11.01.2013)
- В Google Maps появились планы помещений (25.11.2012)
- Отзывчивый или Адаптивный веб-дизайн (Responsive Web Design) (05.01.2013)
- Что скрывается за "дизайном" на самом деле? (16.11.2012)
- Шпаргалка по стилям живописи (30.10.2012)
- Как сделать, чтобы в теге <pre> текст переносился по строкам (wrap text in pre tag)? (15.10.2012)
- Разные стили для внутренних и внешних ссылок (07.04.2012)
- Значок рубля для сайта (25.03.2012)
- Свои стили css для области редактора CKEditor (05.03.2012)