My page layout breaks в IE7, сам по себе, если я навешиваю/открываю пункт меню

Question

Как вы можете видеть, перейдя по ссылке ниже в IE7/AOL, макет разбивается, если вы изменяете размер окна. Однако перейдите на вкладку меню products и сами права. Я не знаю, почему и как это исправить, и выглядит неряшливо. При изменении размера страницы лого и ловушка для ловушек должны оставаться там, где они должны быть, но мое горизонтальное навигационное меню и все, что находится ниже палитры, заканчиваются примерно на 20-30 пикселей справа. При обновлении страницы, смене страницы или открытии пункта выпадающего меню все возвращается к правильному выравниванию.

link text

Answer 1

Он работает должным образом. Элементы li в меню все перемещаются в свободное место. Если в окне недостаточно места, они будут перемещаться к следующей доступной строке. Здесь нечего смотреть.

Просто используйте мини-ширину CSS, чтобы DIV не стал слишком маленьким для меню. Или рассмотрите жесткую компоновку (в отличие от гибкой).

Добавьте следующую строку в свой div, чтобы она работала.

#outer { 
    min-width:790px; 
} 

Answer 2

Чтобы исправить неправильно оказанные (в IE7) дивы, которые исправить себя после того, как парит над чем-то другим, передвигая мышь из, или любое другое странное событие, используйте ниже JQuery:

if ($("html").hasClass("ie7")){ 
     var tempHolder = $("#ajaxresults").html(); 
     $("#ajaxresults").html(tempHolder); 
    } 

Логика довольно просто, и я предполагаю, что вы могли бы сделать это так же легко с помощью «innerHTML» javascript. Просто перепишите содержимое html в div, что неправильно, и это заставит его пересчитать стили.

Что касается предоставления тега html или тега класса ie7, я рекомендую взглянуть на html5boilerplate.com. Если по какой-то причине вы не можете использовать их решение, jquery для него:

if ($.browser.msie){ 
     if ($.browser.version < 8){ 
      $("html").addClass("ie ie7"); 
     } 
     else { 
      $("html").addClass("ie"); 
     } 
    }