Всем привет. У меня первый сайт и я столкнулся со следующей проблемой: div "item" должен выравниваться float:left, но если я это указываю, пропадает фон блока wrapbody см картинки.
Код
html, body {width:100%;font-family:Tahoma;font-size:10pt;}
.main{width:930px;margin:auto;}
.left-block {float:left;width:150px;height:300px;}
.content{float:left;width:660px;}
.banner{margin:0 15px;}
.right-block{float:left;width:120px;height:300px;}
.ul_menu{margin:0;padding:0;list-style-type:none;}
.ul_menu li{background:black;border-top:2px solid white;}
.ul_menu a{color:white;padding:5px;}
.wrapbody{margin:10px 15px;background:black;color:white;}
.bodym15{width:600px;margin:10px 15px;}
.item{float:left;width:180px;height:220px;padding:25px 0 0 15px;}
.item a{font-weight:bold;}
.price a{font-weight:normal;}
<!DOCTYPE html>
<html>
<head>
<title>Интернет-магазин</title>
<link href="style.css" rel="stylesheet">
</head>
<body>
<div class="main">
<div class="left-block">
<img src="img/150.png">
<ul class="ul_menu">
<li><a>Категория</a></li>
<li><a>Категория</a></li>
<li><a>Категория</a></li>
<li><a>Категория</a></li>
</ul>
<ul class="ul_menu">
<li><a>Бренд</a></li>
<li><a>Бренд</a></li>
<li><a>Бренд</a></li>
<li><a>Бренд</a></li>
</ul>
</div>
<div class="content">
<div class="banner">
<img src="img/630x150.png">
</div>
<div class="wrapbody">
<div class="bodym15">
<div class="item">
<img src="img/180.png">
<a>Название товара</a>
<div class="price"><a>Ценар.</a></div>
</div>
<div class="item">
<img src="img/180.png">
<a>Название товара</a>
<div class="price"><a>Ценар.</a></div>
</div>
<div class="item">
<img src="img/180.png">
<a>Название товара</a>
<div class="price"><a>Ценар.</a></div>
</div>
</div>
</div>
</div>
<div class="right-block">
<p>Корзина пуста</p>
</div>
</div>
</body>
</html>