Как отступить сверху от элемента, у которого задан стиль float

Admin CSS

Если верхний элемент имеет свойство float:left или float:right, то следующий за ним элемент отказывается создавать отступ margin. Ниже о том, как решить такую проблему.

Даже, если поставить большой отступ и выставить свойство !important, результата не будет:

Решение 1

Можно между этими двумя элементами поставить пустой элемент div, со свойством:

clear:both;

Решение 2

Применить ко второму объекту свойство:

display: inline-block;

Обычно этого достаточно, но бывает необходимо добавить и другие свойства:

float: none;
clear:both;

Минусом второго варианта является то, что перестаёт работать центровка:

margin: 40px auto;
width: 80%;

Однако её можно заменить на мнимую (отступить с двух сторон), хотя это не так удобно, если дизайн предполагает адаптивную вёрстку:

margin: 40px;

На сайте отсутствует реклама! Значете почему?

Помогать людям - моё хобби. А навыки разработчика позволяют не парится нулевой монетизизацией этого сайта. Хотя...

Если вам помогла информация, то даже от доната в 40 рублей мне будет приятно. Докину немного, куплю латте в макдаке, вспомню за чей счет банкет и карма вам зачтется!

Но и просто оставленный комментарий благодарности ниже принесет мне улыбку радости :)

А если захочется написать всякие гадости с переходом на личности, да тоже не стесняйтесь, но обычно я отправляю такое в спам. Люблю, когда дома чисто.

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

Напишите свой комментарий, если вам есть что добавить/поправить/спросить по теме текущей статьи:
"Как отступить сверху от элемента, у которого задан стиль float"