2013-06-03 2 views
2

В настоящее время я разрабатываю меню html/css. Моя проблема заключается в том, что страница, в которую будет вставлена ​​вставка, когда загружается, заставляет браузер перейти в причуды и режим совместимости. Я не могу это контролировать.встроенный блок в режиме совместимости IE9

Вот мой CSS:

.community-menu {  
    margin: 5px; 
    display: inline-block; 
    text-align: center; 
    vertical-align: middle; 
    padding: 15px 30px; 
    cursor: pointer; 
} 

#container { 
    width: 100%; 
    position: relative; 
    text-align: center; 
} 

Моя проблема заключается в том, что встроенный блок в IE причуд и режим совместимости вызывает меню, чтобы занять всю ширину родительского DIV.

Вот что дивы выглядят как в Chrome и Firefox:

Chrome and Firefox rendering of inline-block

В IE те же дивы расширить до полной ширины родительского DIV

IE rendering of inline-block

Я пытаюсь для достижения центрированных divs, которые изменяют размер с текстовым содержимым, которое по мере изменения размера браузера автоматически сдвигается вниз.

Я нашел код из другого вопроса SO, который показывает мою проблему here при просмотре с помощью IE в режиме совместимости и причуд.

После замечания Spudley здесь ПИК показать режим по умолчанию он загружает в.

enter image description here

Несмотря на то, что говорит IE8, конечный результат одинаков в IE9. На разных компьютерах сегодня :)

+1

Не могли бы вы опубликовать рабочий пример? HTML был бы удобен. –

+1

Проблема с IE заключается в том, что режим quirks использует старый движок рендеринга, который не знает о таких вещах, как 'inline-block'. Об этом нет. Почему вы не можете использовать режим соблюдения стандартов? –

+1

Вы контролируете режим совместимости IE. Добавьте заголовок ответа «X-UA-Compatible: IE = edge» HTTP к вашим настройкам сервера или добавьте элемент '', чтобы запретить переключение к режиму просмотра совместимости. –

ответ

0

Когда мне нужно эмулировать встроенный блок в olds и quirks IE, я просто заменю встроенный блок встроенным. (с условным комментарием)

+0

Я подумал об этом, однако, когда я использую встроенное объявление, декларации полей и дополнений игнорируются, и в результате элементы меню перекрываются при переходе на новую строку. – Bruno

2

"дисплей: встроенный блок;" лучше поменять: { float: left | right; diplay: inline; zoom: 1; }

Смежные вопросы