Меню сайта отображается смешно во всех IE до IE 8 - PullRequest
Новая
       32

Меню сайта отображается смешно во всех IE до IE 8

0 голосов
/ 29 августа 2010

Я новичок в CSS и кодировал свой первый сайт с помощью CSS.Я признаю, что еще не полностью понимаю CSS, но хотел бы изучить.Я слышал о специальном кодировании XHTML и CSS, необходимом для старых браузеров IE, но на самом деле не знаю, какой код CSS вызывает проблемы.

Веб-сайт здесь .Проблема в верхнем и нижнем меню навигации на всех страницах, кроме блога и Moodle (я еще не обновлял их).Может кто-нибудь помочь мне с тем, что нужно изолировать для IE?

Большое спасибо!

Ответы [ 2 ]

1 голос
/ 29 августа 2010

Вам нужно сделать три вещи.

  1. использовать строгий тип документа в верхней части страницы.на данный момент у вас переходный.строгий тип документа гарантирует, что IE соответствует стандартам CSS, насколько это возможно.

  2. Добавьте следующий бит CSS для элементов списка навигации

    #topnavcontainer ul li { display:inline; }

  3. Добавьте следующий бит CSS для нижних элементов списка навигации

    #bottomnavcontainer ul li { display:inline; }

0 голосов
/ 29 августа 2010

Другое решение (которое должно работать независимо от типа документа); 

#topnavcontainer li {
    display:inline-block;
    zoom: 1;
    *display: inline;
}

Краткое объяснение состоит в том, что inline-block позволяет стилизовать элементы списка, как если бы они были элементами блочного уровня (т.е. датьих ширина, высота и т. д.), при этом выкладывая их в линию.Преимущество перед float: left заключается в том, что вы можете применить выравнивание текста к #topnavcontainer, чтобы выровнять вашу навигацию влево / по центру / справа.Вы также можете установить вертикальное выравнивание, хотя иногда это кажется немного привередливым.

Две другие строки, zoom и *display, - это хитрость, чтобы заставить это работать в более старых версиях IE.Это длинное объяснение, но если вы хотите узнать больше об этом, поищите в Google слова «hasLayout» и «css star hack».

...