Странная проблема

[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;}

[Great Rash]

.header-middle ul li {

  position: relative;

}

[rus]

а нафига тут вообще абсолютное позиционирование?

домик как я полагаю должен быть ссылкой и вести на главную?

тогда почему он в диве, а не в теге <a>?

[HappyAndRu]

.header-middle ul li {  position: relative;}

Что тут не так?

 

а нафига тут вообще абсолютное позиционирование?

 

 

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