У меня есть два divs бок о бок в оболочке div. Они идеально подходят и отображаются правильно. Однако, когда я пытаюсь добавить прописку в левую часть div левой руки, она не только перемещает содержимое этого div вправо, но и фактически перемещает содержимое правой руки div. Если я добавлю что-нибудь более чем 20px отступов, он фактически переместит правую руку div вниз в следующую строку! Как это возможно? Публикация CSS и HTML ниже. Обертка div является «hwrapper». Левая рука div - «rbox», а правый div - «карта». Как я уже сказал, добавление дополнений в левую часть «rbox» также перемещает содержимое «карты» вправо. Как я могу это исправить?Padding ведет себя как Margin
#header {
height:800px;
width: 100%;
margin-top: 0px;
background:url(/assets/header-tail.gif) 0 0 repeat-x #f7f7f7;
}
#hwrapper {
width: 1000px;
height: 600px;
margin: 0 auto;
text-align: center;
}
#header .logo {
padding: 3px;
text-align: center;
}
#rbox {
background:url(/assets/hredbox.png) 0 0 no-repeat;
height: 420px;
width: 274px;
float: left;
text-align: left;
padding-top: 10px;
}
#card {
margin-left: auto;
height: 420px;
width: 720px;
background:url(/assets/silverbackh360b0.png) 0 0 no-repeat;
float: right;
text-align: left;
padding-top: 20px;
}
HTML:
<div id="header">
<div class="logo"><%= link_to image_tag("etlogo.png",alt:"Logo"), 'index.html' %></div>
<div id="hwrapper">
<div id="rbox"><span><center>Some Text</center></span><br><p><br>
<dl>
A list goes here.
</dl><br><p><br>
<span><center>Log In Here</center></span>
</div>
<div id="card">Lots more text in here.
</div>
</div>
</div>
Любая помощь будет высоко оценено как я был под убеждение, что заполнение только элементы, произведенное в блоке, а рентабельность осуществляется связь между блоками.
Какой браузер вы используете? – DOK
Тестирование как в Chrome, так и в Firefox. Те же результаты в обоих. –
Вы знаете, что когда вы добавляете дополнение к div, он увеличивает ширину div? Мое предположение состоит в том, что добавив отступы, вы фактически делаете ширину двух внутренних div больше, чем у внешнего div, что приводит к их смещению вниз. – mcriecken