Верстка

[vova.a99]

Есть меню. но оно отображается не правильно. Как есть (ФОТО):

Как надо:

Есть код:

<div id="menu">
<div class="menu">
<a href="#" ><img class="km" src="img/a_km.jpg"><h5>Аренда кофемашин</h5></a>
</div>
<div class="menu">
<img class="km" src="img/p_km.jpg">
</div>
<div class="menu">
<img src="img/r_km.jpg" class="km">
</div>
<div class="menu">
<img class="km" src="img/p_k.jpg">
</div>
</div>

+css

#menu {
	margin-top: 30px;
	background: url(img/menu_bg.jpg);
    width: 200px;
	height: 440px;
	-webkit-box-shadow: -4px 5px 13px rgba(50, 50, 51, 0.48);
	-moz-box-shadow:    -4px 5px 13px rgba(50, 50, 51, 0.48);
	box-shadow:         -4px 5px 13px rgba(50, 50, 51, 0.48);
    padding: 10px;
   }
   .menu{
	margin-bottom: 33px;   
	width: 180px;
	height: 85px;
   }
.km{
	border:#eac35d;
	border-width: 2px;
	border-style: solid;
	float: left; 
	}

Это меню.При убирании float: left; текст съезжает, но все картинки становятся на место. Если убрать текст, то картинки на месте, но без текста. Помогите!

[Modestes]

http://jsfiddle.net/KphHZ/2/