Пытаюсь сделать шаблон для сайта. Нужно сделать так что бы блок "B" по правому краю обтекал блок "С", свойство float:left, для блока "B" указал, а всё равно, обтекания не происходит, пробовал указывать display: inline и inline-block, тоже самое, желаемого результата это не дало.
Желаемая схема такая:
Блок "A"
Блок "B" Блок "C"
Блок "D"
Моя страничка:
http://antton120.narod.ru/SP/index.html
Кто знает подскажите пожалуйста, что здесь не так?
CSS:
|
Код:
|
body, html
{
width:720px;
margin:4px;
padding:0px;
background-image: url(../Images/Slujebnie/121.jpg);
background-repeat: repeat;
}
#container_ohvat
{
valign:top;
min-width:500px;
width:expression(
(document.compatMode && document.compatMode == 'CSSI1Compat')
?
(
document.documentElement.clientWidth < 500
?
"500px"
:
"auto"
)
:
(
document.body.clientWidth < 500
?
"500px"
:
"auto"
)
);
margin:0;
text-align:left;
}
#ogranichitel
{
width:auto;
height:inherit;
margin-top:10px;
clear:both;
}
#verh_p
{
z-index:0;
background-color:#CCCCCC;
width:inherit;
height:28px;
margin-left:0px;
margin-right:0px;
margin-top:0px;
margin-bottom:0px;
}
#content
{
z-index:2;
float:left;
background-color:#006666;
width:200px;
height:auto;
margin-left:0px;
margin-right:0px;
margin-top:0px;
margin-bottom:0px;
}
#menu_u
{
z-index:1;
background-color:#CC9933;
width:200px;
height:auto;
margin-left:0px;
margin-right:0px;
margin-top:0px;
margin-bottom:0px;
}
#niz_p
{
z-index:0;
background-color:#FFFF66;
width:inherit;
height:31px;
margin-left:0px;
margin-right:0px;
margin-top:0px;
margin-bottom:0px;
} |
HTML:
<html>
<head>
<link href="css/style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="container_ohvat">
<div id="verh_p">
A
</div>
<div id="ogranichitel"></div>
<div id="content">
B
</div>
<div id="menu_u">
C
</div>
<div id="ogranichitel"></div>
<div id="niz_p">
D
</div>
</div>
</body>
</html>
-----------------------------------
С уважением, Антон.