Не понимаю поведение margin

infidel · September 15, 2015

Всем доброго дня.
Упрощенный для наглядности код того что я делаю

<html><head></head><body><div style="background:#000;">    <div style="background:#fff;width:100px;height:100px;margin:50px 0 0 50px"></div></div></body></html>

Разве не должны отступы от вложенного дива быть собственно внутри дива в который он вложен? Почему верхний margin отрисовывается так как будто он указан для родительского блока?

sigma77 · September 15, 2015

Это особенность марджинов. Они внешние, не внутренние отступы.

http://htmlbook.ru/samlayout/blochnaya-verstka/skhlopyvayushchiesya-otstupy- тут всё подробнее о происходящем эффекте.

rus · September 15, 2015

для дива родителя:

    float:left;    width:100%;

infidel · September 15, 2015

для дива родителя:
    float:left;    width:100%;

Спасибо, примерно что-то такое и хотел сделать, однако это выглядит как костыль, причем мне совершенно не понятно почему я должен этот костыль туда вставлять) Возможно я неправильно понимаю, как работает margin или не знаю чего-то еще, что вызывает такое поведение. Хотелось бы разобраться.

infidel · September 15, 2015

Это особенность марджинов. Они внешние, не внутренние отступы.
http://htmlbook.ru/samlayout/blochnaya-verstka/skhlopyvayushchiesya-otstupy- тут всё подробнее о происходящем эффекте.

Я исчерпал лимит положительных отметок, лайкнув товарища выше) Спасибо большое!

Sign In

Не понимаю поведение margin

Question

infidel

Link to comment

Share on other sites

4 answers to this question

Recommended Posts

sigma77

Link to comment

Share on other sites

rus

Link to comment

Share on other sites

infidel

Link to comment

Share on other sites

infidel

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information