Всем привет!
Что должен делать вот этот код:
<html>
<head>
<style type="text/css">
.c1{
width:100px;
height:100px;
background-color:#ff0000;
float:left;
padding:0px 15px;
}
.c2{
width:100%;
height:100%;
background-color:#00ff00;
float:left;
padding:0px 15px;
}
.c3{
width:100%;
height:100%;
background-color:#0000ff;
float:left;
}
</style>
</head>
<body>
<div class="c1">
<div class="c2">
<div class="c3">
</div>
</div>
</div>
</body>
</html>
Я думал он создаст див1 шириной 100 пикселей, внутрь которого положит другой див2 шириной 100-15-15=70 пикселей, внутрь которого он положит другой див3 шириной 70-15-15=40 пикселей. Черта с два! он создаст див1 шириной 145 (!) пикселей, во внутрь которого запихнет другой див2 шириной 130 пикселей, во внутрь которого запихнет див3 шириной 100 пикселей! Другими словами padding не создает отступ внутри дива, он увеличивает его размер!
Что нужно: У меня есть внешний див, ширину которого я жестко задаю, и мне нельзя чтбы он был шире. В нем мне нужно создать внутренний див, который был бы на всю ширину внешнего дива за исключением отступов слева и справа.
Как это сделать?
P. S. Не обязательно div, можно это сделать как-то по-другому? Важен внешний размер (при условии что он может изменяться - сайт резиновый) и отступы вовнутрь.
P. P. S. Браузер Opera
