Не знаю, почему мне так сложно с этим справиться. Попытка добавить верхний край 10px к
то есть внутри div. Но это не добавляет желаемого желоба и просто подталкивает содержащий div div 10px.
Стили
#item{width:738px; height:168px; background-image:url(../images/item_bg.png);margin:0px auto;} #description{width:314px; height:55px;} #description p{font:12px arial; color:#666666;margin:10px 0 0 30px;} HTML / PHP
echo "<div id='item'> <div id='description'><p>{$row['description']}</p></div> </div>";
Если я использую padding, он отлично работает, но я хочу знать, почему margin-top не работает?
Попробуйте overflow:hidden в окружающем div .
Причина, по которой заполнение работает, и маржа не может быть следующей:
Padding вводит водосточный желоб между содержимым и его окружающим элементом, тогда как margin вводит водосточный желоб между окружающим элементом и ближайшим «твердым элементом».
Это немного сбивает с толку, потому что мы обычно делаем вывод, что margin вводит водостоки между окружающими элементами и ее родителем, но это не так, если родительский элемент не является «твердым». Трюк состоит в том, чтобы превратить родительский элемент во что-то «твердое» с использованием overflow: hidden
Быстрый пример:
<style> #parent{ position: relative; left: 100px; top: 100px; width: 100px; height: 100px; background: #DDD; /* Try adding here overflow:hidden */ } #surrounding-element{ margin-top: 50px; background: #AAA; } </style> <div id="parent"> <div id="surrounding-element">content</div> </div>
Выглядит отлично здесь http://jsfiddle.net/huhu/hRH6k/, а маржа работает на 10 пикселей.
Попробуйте margin:10px 0 0 30px !important ;
его правильная работа может быть у вас другая ошибка. Ваш код работал правильно.
взгляните на это сообщение для объяснения об рушительных краях
Если вы пытаетесь нажимать содержимое внутри div на 10px, вы не можете использовать свойство margin или margin-top, вам нужно использовать отступы.
Вы испытываете смену Margin, которая является частью спецификации модели CSS Box . Вероятно, вы просто хотите поместить некоторое дополнение к родительскому элементу, а не к положению на дочернем элементе.