Не нравятся результаты поиска? Попробуйте другой поиск!
DLE FAQ » Все вопросы » Общие вопросы по вёрстке » Не совсем правильно работает margin во внутреннем блоке

Не совсем правильно работает margin во внутреннем блоке


     09.11.2011    Общие вопросы по вёрстке, Стили (CSS)    2959

вопрос
Есть задача, например, нужно получить подобный блок:
Не совсем правильно работает margin во внутреннем блоке

Он состоит из 2х вложенных div-ов с различными фонами.
Если делать через padding родительского div-а, то все нормально:
<div style="background:#ebecec;width:200px;padding:7px 0;">
    <div style="background:#777;height:50px;margin:0 7px;"></div>
</div>


А вот если использовать только margin во внутреннем блоке
<div style="background:#ebecec;width:200px;">
    <div style="background:#777;height:50px;margin:7px;"></div>
</div>

То получим такое:
Не совсем правильно работает margin во внутреннем блоке


Как используя только margin во внутреннем блоке получить правильный результат?

Ответил: Sander


Этот ньюанс описан в этой статье.
Как вариант, наружному контейнеру применить свойство display:inline-block, но вот в ie6-7 могут быть проблемы.
Ну или внутреннему блоку добавить стиль float:left|right

1 комментарий

bratoz
Юзер

bratoz - 30 января 2012 11:15 -

Была подобная проблема...охх сколько же я сил потратил...
Не помню правда как решил))

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

Похожие вопросы

наверх