HappyAndRu

Что тут не так? Я делал без позиционирования, убирал нестандартное позиционирование тут и в первом элементе, бесполезно, все то же самое.

Всем привет. Делаю первую свою верстку по макету и столкнулся с непонятной для себя проблемой: на картинке домик должен быть слева перед desctops, а остальные элементы соответственно должны следовать за ним, но он становится по середине и при этом все меню выпадает вниз. Что с этим делать и в чем причина такого поведения? Заранее спасибо. <div class="header-middle"> <div class="header-content"> <ul class="menu "> <li> <div class="menu-icon"></div> </li> <li><a href="">Desktops</a></li> <li><a href="">Laptops & Notebooks</a></li> <li><a href="">Components</a></li> <li><a href="">Tablets</a></li> <li><a href="">Software</a></li> <li><a href="">Phones & PDAs</a></li> <li><a href="">Cameras</a></li> <li><a href="">Contact</a></li> </ul> </div> </div>.header-content { width: 940px; margin: 0 auto; padding-left: 10px; padding-right: 10px; }.header-middle { background: url(img/header-middle-bg.png) repeat-x; border-bottom: 4px solid #F1E9CF;}.header-middle ul.menu { position: relative;}.header-middle ul li { display: inline-block; background: url("img/header-middle-bg.png") repeat-x; padding: 20px; margin-right: -5px; vertical-align: middle;}.header-middle li:first-child { margin-right: 0px; padding-left: 5px; padding-right: 5px;}li .menu-icon { position: absolute; top: 23px; width: 16px; height: 16px; background: url(img/home.png) no-repeat; }.header-middle a { font-family: Dosis-Book, serif; font-size: 16px; color: #7D7253; text-decoration: none;}