2010-07-23 2 views
1

У меня возникла странная проблема с IE8. Страница DOCTYPE - QuirksMode, и я НЕ МОГУ ее изменить (я бы хотел, но в данный момент нет способа). Ширины взломаны, чтобы исправить разницу между модемами модема между IE и другими браузерами. Это простая горизонтальная навигационная панель. Он имеет границу, а выбранный элемент должен быть немного больше, чтобы «покрыть» внешнюю границу. Работает как очарование в FF, но в IE, #container игнорирует его свойство высоты и расширяется, чтобы соответствовать его дочерним элементам, получает до 34 пикселей и граница не покрывается.Проблема с IE Quirks Mode - Div с фиксированной высотой расширения

Упрощенная HTML заключается в следующем:

<style> 
    #container { 
     padding:0px; 
     margin:0px; 
     height:30px; 
     border-bottom:#000 2px solid; 
     background-color:#ccc;width:780px 
    } 
    #list { 
     padding:0px; 
     margin:0px; 
     height:100%; 
     float:left; 
     background-color:#CCFFFF 
     list-style-type:none; 
    } 
    #list li { 
     float:left; 
    } 
    .selected_item { 
     height:30px; 
     *height:32px; 
     border-bottom:#FFF 2px solid; 
     background-color:#FFCCFF 
    } 
    .nonselected_item { 
     height:28px; 
    } 
</style> 
    <div id="container"> 

      <ul id="list"> 
       <li class="selected_item">First item</li> 
       <li class="nonselected_item">Second item</li> 
      </ul> 

    </div> 

Любые идеи? Спасибо заранее. Андреа.

ответ

0

С помощью Quirks DOCTYPE вы просите IE притвориться, что это IE6 (более или менее). Если это действительно непреложный DOCTYPE, тогда вам либо нужно приписать к IE6 quirks и правильную разметку, поскольку десятилетие веб-мастеров пришлось или найти способ сказать IE8, чтобы никогда не уважать Quirks.

Инжиниринг - это компромиссы; да, я понимаю, что вы не сможете изменить это одно слово на этой важной странице критической ситуации и что вам будет стоить огромных усилий, чтобы кодировать стандарты браузера с 2001 года, но если это ограничения, так оно и есть.

1

Попробуйте добавить позицию: абсолютная к #list

0

первой линии, тип не определен, попробуйте < стиль типа = «текст/CSS»>

на 7-й линии, которую вы пропустили точку с запятой после ширины background- цвет: #ccc; ширина: 780px

попробуйте добавить max-height: 32px; to #list li

1

Благодарим вас за ответ Alohci, который сделал трюк!

MSW, спасибо за ваш ответ тоже, но это приложение используется примерно 5 тысячами пользователей в день, на 40 продуктивных веб-сайтах, которые работают по одному и тому же коду, и мы должны загружать и тестировать около 2 тысяч страниц, чтобы изменить doctype. И ... у нас не так часто возникают проблемы с CSS, потому что структура не меняет статус. У нас может быть один или два из них в год, поэтому усилия по изменению doctype не оправданы прямо сейчас. Мы изменим его в тот день, когда нам нужно осуществить изменения, которые влияют на все 40 веб-сайтов, и не могут быть достигнуты иначе.