Левый плавающий список

Question

Я хочу разместить списки (DL) слева, как изображение внизу этого сообщения.

Если я использую это:

dl {
    float: left;
    margin-bottom: 25px;
    vertical-align: top;
    width: 50%;
}

... Тогда спискичто короче, чем длинный, будет помещен в нижней части длинного.Они не будут продолжаться после вышеприведенного списка.

Может кто-нибудь из вас, ребята, скажет мне, что я делаю неправильно ??..: -)

Answer 1

То, что вы хотите, вероятно, невозможно с помощью поплавков.AFAIK Есть решения для JavaScript для этого, но я не могу найти их прямо сейчас.

Одна вещь, которую вы можете попробовать, если вы не против не поддерживать IE, это CSS-столбцы.Откажитесь от своего правила и используйте следующее вместо

#parentElement { /* selector to the parent of your dl's */
  column-count: 2;
  -moz-column-count: 2;
  -webkit-column-count: 2;
}