Css блоки друг под другом

У меня есть два внутренних div, которые вложены внутри div оболочки. Я хочу, чтобы два внутренних div были расположены один под другим. Но сейчас они устраиваются по одной линии.

Попробуйте очистить: слева на # inner2. Поскольку оба они установлены на float, это должно привести к возврату строки.

Если вы хотите, чтобы два div отображались один над другим, самым простым ответом является удаление float: left; из объявления css, поскольку это приводит к их сглаживанию до размера их содержимого (или css определенный размер), и, будьте осторожны друг с другом.

В качестве альтернативы вы можете просто добавить clear:both; в div s, что заставит плавающий контент очистить предыдущие поплавки.

Поведение по умолчанию для divs – это получение полной ширины в родительском контейнере. Это то же самое, что если бы вы дали внутренним divs ширину 100%.

Поляв divs, они игнорируют их значение по умолчанию и определяют их ширину, чтобы они соответствовали содержимому. Все, что находится за ним (в HTML), помещается под div (на отображаемой странице). Именно по этой причине они выстраиваются рядом друг с другом.

Свойство float CSS указывает, что элемент должен быть взят из нормальный поток и помещенный вдоль левой или правой стороны его контейнер, где текст и встроенные элементы будут обтекать его. плавающий элемент – это тот, где вычисленное значение float не равно.

Избавьтесь от float, и divs будут выровнены друг под другом. Если этого не произойдет, у вас будет еще один css для div или дочерних оболочек, определяющих плавающее поведение или встроенный дисплей.

Если вы хотите сохранить float, по какой-то причине вы можете использовать clear для второго div для reset плавающие свойства элементов перед этим элементом. clear имеет 5 действительных значений: none | left | right | both | inherit . Очистка без поплавков (используется для переопределения унаследованных свойств), поплавки влево или вправо или оба поплавка. Inherit означает, что он наследует поведение родительского элемента

Читайте также:  Загрузка фото с айфона на компьютер

Кроме того, из-за поведения по умолчанию вам не нужно устанавливать ширину и высоту на авто. Вам нужно только это, вы хотите установить жестко заданную высоту/ширину. Например. 80%/800px/500em/.

1 Anna [2015-09-02 01:13:00]

Что я могу сделать, чтобы блоки разной высоты разделялись регулярным интервалом?

Например, блок 2 на рисунке ниже должен быть прямо под блоком 1.

1 ответ

2 Решение Michael Laszlo [2015-09-02 02:24:00]

Вы можете разделить страницу на столбцы с левым плаванием, а затем заполнить каждый столбец обычными div.

Есть 2 inline-block , их нужно поместить друг под другом. Есть ли способ без костылей и не правя ‘html’ это сделать? з.ы. в изначальном коде в инлайн блоках содержатся динамические элементы, поэтому нельзя применять ширину 100%

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Adblock detector