IE7 Bug - основной блок перемещается влево при наведении

Question

Я пытаюсь исправить эту проблему в IE7, что при наведении на нее она не останется на своем месте, а перейдет на левую сторону.Я пробовал display: inline, но в этом случае он не будет работать.Вы можете проверить это здесь: http://www.sneakyrascal.com/kayak/results.htmlЭто код, который я использую для основного блока (средний):

.results #container{ 
    float:left;
    width: 527px;
    margin:38px 0 0 20px;
    padding-left:1px;
    position: relative;
    border: #ccc 1px solid;
    background: #fff;
}

Заранее спасибо

Answer 1

Проблема вызвана position:relative на #main-content. Если вы удалите его, контейнер больше не будет прыгать:

#main-content {
    margin-top: 20px;
    position: relative; /* delete this */
}

Также вы, возможно, заметили, что ваш .sites div не выстроился правильно. Добавление left: 0 исправит это:

.results #container UL LI.box .left-side .sites{
    width: 90px;
    text-align: center;
    position: absolute;
    bottom: 10px;
    left: 0; /* add this */
}

Answer 2

Да, странная ошибка, вы можете исправить ее, правильно указав свой идентификатор # main-content.Просто добавьте это к этому:

display:inline-block;