Переполнение IE 7 и 8: скрытая проблема

Question

Я работаю над CSS проекта. И столкнуться с некоторыми проблемами переполнения с IE. Это тестовая площадка:

http://eparking.bluesys2.ch/fr/parking/search.html?l=Fribourg&d=27.6.2010&t=

Вы можете прокрутить список с помощью кнопок под списком. В Firefox, Safari и всех других обычных браузерах все работает нормально. Но в IE я не могу заставить это overflow: hidden; работать, и это начинает сводить меня с ума. Список показывает, всегда отображается в полном объеме, теперь независимо от того, что я пытаюсь. Кто-нибудь может дать мне подсказку?

это css контейнера списка:

div#listing {
width: 204px; height: 364px; overflow: hidden;
}

и это объекты внутри:

div#listing ul li {
    position: relative;
    padding: 5px;
    margin: 0 0 7px;

    height: 54px;

    background-image: -moz-linear-gradient(top, #f5f5f5, #ddd);
    background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #f5f5f5),color-stop(1, #ddd));
    border: 1px solid #ddd;

    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;

    -moz-box-shadow: 0 0 8px #ddd;
    -webkit-box-shadow: 0 0 8px #ddd;
    box-shadow: 0 0 8px #ddd;
}

Событие, если я установил UL, который содержит LI с моим списком, на высоту 100px со скрытым переполнением. Они появляются.

Answer 1

Хорошо известная ошибка IE.Сделайте это:

div#listing {
position: relative;
width: 204px; height: 364px; overflow: hidden;
}

Редактировать: Ссылка объясняет это здесь: http://snook.ca/archives/html_and_css/position_relative_overflow_ie/