Несколько проблем с IE CSS - PullRequest
2 голосов
/ 29 ноября 2011

Хорошо, я признаю, что всегда вижу, как люди цепляются за IE (Internet Explorer xx), и я никогда не жалуюсь на это, но понимаю, что могу ошибаться.Я хардкорный пользователь Chrome, иногда я открываю Firefox для чего-то или для проверки представления, но никогда IE не будет до другого дня.Я открыл IE 8 на сайте, над которым я работаю, и был шокирован. Было так много ошибок, и я не виню IE, я просто начинаю делать правильный CSS и дизайн, я больше бэкэнд-кодер.Поэтому, скорее всего, я просто не использую правильный CSS

. Ниже приведено изображение из IE8 моего проекта, я пометил каждый раздел, в котором есть проблема.

enter image description here

1) Этот фон должен увеличить ширину страницы, и это происходит в Firefox и Chrome.

Вот некоторые CSS для этой области

#header-wrap {
   width: 100%;
   position: relative;
   margin: 0 auto;
   height: 95px;
   background: #F3F3F3 url(../images/layout/blue-spike.gif) repeat-x;
   border-bottom: 1px solid #DEDEDE;
}

2) Это неупорядоченный список навигации, он должен показывать все элементы списка в строке слева направо, а когда он становится широким, он начинает новый ряд элементов слева направо, он делаетчто в Firefox и Chrome

#tag-list li a {
   color: white;
   text-transform: uppercase !important;
   background: #585858;
   padding: 4px 6px 4px 6px!important;
   -moz-border-radius: 3px;
   border-radius: 3px;
   font: .8em Helvetica,Arial,sans-serif;
   margin: 1px 0px 3px 3px;
   display: block;
   float: left;
}

3) Один и тот же код из номера 2, но вместо квадратных углов каждая ссылка должна иметь закругленные углы, она работает таким же образом с Firefox ихром с радиусом границы


4 То же, что и в разделе заголовка, он должен расширять всю ширину страницы, но не

#footer {
  clear: both;
  background: #444 url(../images/noise-gray.png) center;
  color: #666;
  font-size: 1.1em;
  with: 100%;
  padding-bottom: 15px;
}

Этоеще одно фоновое изображение для нижнего колонтитула, которое является зигзагообразнымдаже не отображается в IE с этим кодом ниже

#footer-zig-zag {
  background: url(../images/shake-up.png) top repeat-x;
}

Я понимаю, что это неопределенный вопрос, и я не ожидаю, что кто-то перекодирует сайт, намекните, почему я не добавил весь HTML.

Я просто спрашиваю, если из вышеприведенного CSS есть что-то неправильное для работы с IE.

Я никогда не знал, насколько плох или отличается IE от Chrome и Firefox, иЯ не хотел бы повторять одни и те же ошибки, мне все равно, чтобы поддерживать IE на 100%, но я думаю, что могу сделать немного лучше, чем мой текущий.

Спасибо за любую помощь

1 Ответ

1 голос
/ 29 ноября 2011

, не видя его полностью, вы правы, это немного расплывчато, но от руки,

2) выглядит так, будто li находятся в отображении блока .... установите их как float: left;дисплей: встроенный;

3) border-radius не поддерживается в ie8.для ie9 вам нужно добавить -ms-border-radius;Вы можете найти исправления js для поддержки

1) и 4a), трудно сказать, но с шириной: 100%, и они не покрывают это, я собираюсь предположить, что то естьчтение родительской ширины как что-то правильно.установите для родительского элемента значение width: также 100%.

вы можете использовать таргетинг, например, с помощью условных комментариев, чтобы не связываться с реальными стилями, такими как:

<! - [if IE]>

<! [Endif] ->
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...