Список в две колонки

71

Эгоист

21 октября 2011, 13:05

5398

Есть список, пример:

<ul>

<li>ссылка1</li>

<li>ссылка2</li>

<li>ссылка3</li>

<li>ссылка4</li>

<li>ссылка5</li>

<li>ссылка6</li>

</ul>

Как сделать, чтобы:

ссылка1, ссылка2, ссылка3 - первая колонка

ссылка4, ссылка5, ссылка6 - вторая колонка

77

Myworld

21 октября 2011, 13:05

#1

td попробовать

71

Эгоист

21 октября 2011, 13:16

#2

мне надо именно решение через список, а не через таблицу

47

gormarket

21 октября 2011, 13:57

#3

Вариант

ссылка1, ссылка3, ссылка5 - первая колонка

ссылка2, ссылка4, ссылка6 - вторая колонка

еще можно сделать стилями, а так как Вы хотите - только двумя списками:

<li>ссылка1</li>

<li>ссылка2</li>

<li>ссылка3</li>

</ul>

<li>ссылка4</li>

<li>ссылка5</li>

<li>ссылка6</li>

</ul>

Товары и цены в магазинах Вашего города: Городской рынок (http://gormarket.ru/)

C

14

cryptex

21 октября 2011, 14:00

#4

в самых общих чертах


<style>

* {margin: 0; padding: 0; border: none;}

#cntr {width: 70%; border: 1px solid #dedede; margin: 0 auto;}

#cntr ul {background: #ccc; text-align: center; min-width: 600px;}

#cntr li {width: 32%; display: inline-block; margin: 1px; background: #fefefe; border: 1px dotted #ccc;}

</style>

<body>

<div id="cntr">

<ul>

<li>ссылка1</li>

<li>ссылка2</li>

<li>ссылка3</li>

<li>ссылка4</li>

<li>ссылка5</li>

<li>ссылка6</li>

</ul>

</body>

в ослостиле:

#cntr li {display: inline; zoom: 1;}

#cntr - здесь для удобства группирования, можете этот контейнер убрать, делегировав соотв. стили ul и скаскадировать

L5

25

leonov536

21 октября 2011, 14:42

#5

http://www.artlebedev.ru/tools/technogrette/html/list2columns/

Отсрочка войны ведёт к выгоде твоего соперника

74

Dimid

21 октября 2011, 15:27

#6

то что вам нужно:


<html>



<style>

ul.twocolumn { width: 400px; }

ul.twocolumn li { width: 200px; float: left; }

</style>



<ul class="twocolumn">

<li>1</li>

<li>2</li>

<li>3</li>

<li>4</li>

<li>5</li>

</ul>



</html>

размеры только подправите на свои

Dimid добавил 21.10.2011 в 19:31

хотя если нужно именно с такой сортировкой как у вас, лучше сделать такой список на javascript

Спец.тема - для белых DIV-ная таблица Подскажите что за скрипт?

C

291

Chukcha

21 октября 2011, 21:20

#7

li {float:left;

width:50%

}

upd 50 может быть много, изменить до 49 ... 48

34

AlExTeam

22 октября 2011, 12:16

#8

<ul>

<li>ссылка1</li>

<li>ссылка2</li>

<li>ссылка3</li>

<li>ссылка4</li>

<li>ссылка5</li>

<li>ссылка6</li>

</ul>

</div>

Internet killed the video star

A

54

awa

22 октября 2011, 12:24

#9

AlExTeam:
<div style="columns:2;">

современные технологии?

Веб-дизайн - icq 282886909

34

AlExTeam

22 октября 2011, 13:32

#10

awa:
современные технологии?

вроде ж еще во второй было реализовано

В 2023 году 36,9% всех DDoS-атак пришлось на сферу финансов

Что делать, чтобы попасть в ответы Google Bard