Я думаю, что об этом спрашивали миллион раз, но с разными определениями проблемы. И это, вероятно, либо легко исправить, либо долгое желание от веб-дизайнеров, и до сих пор без ответа. note : я выполнил поиск css float в стеке, но, хотя некоторые выглядят как моя проблема, до сих пор я не нашел подобного.
То, что я пытаюсь сделать, станет ясным, если вы увидите вложение. Я хочу, чтобы они были аккуратно сложены в ряды по 3, где высота каждого элемента <li>
разная. Другими словами: самый высокий элемент <li>
в строке является ведущим, и следующий ряд элементов должен переноситься под этим. Прямо сейчас элементы в новой строке сталкиваются с содержимым более длинного списка в начале, не позволяя первому элементу новой строки полностью сместиться влево.
Обратите внимание, что я не хочу решать эту проблему с помощью php или js, я думаю, что должно быть чистое решение css ... Потому что с php я, конечно, мог бы добавить класс типа "new-row" в это и примените clear: both
к этому, и это обернет. Если я хочу сделать то же самое в CSS, то я не могу без использования плохо поддерживаемых вещей :nth-of-type
. Кроме того, блок контента имеет переменную ширину, поэтому иногда в строке 3, а иногда может быть только 2 или до 6.
Кто может помочь?