Стиль CSS не работает в IE, но только в Chrome

Question

Интересно, почему этот стиль не работает в IE и FF, но ТОЛЬКО в Chrome

#show{top:10%; position:relative; margin: 0px auto; width:100%;}

[Изменить]

Если я хочу сделать ту же работу в IE и FF, что мне нужно сделать

Спасибо Jean

Answer 1

верх: 10%; позиция: относительная;

10% чего? Для относительно расположенного элемента процентные размеры измеряются относительно размера родительского элемента. К родительскому элементу применяется height:? Если это не так, вот почему у вас нет движения: вы говорите «переместите верх на 10% от« авто », что является неопределенной величиной».

Если вы хотите 10% высоты окна просмотра браузера, вы должны указать каждому элементу между корнем html и позиционируемым элементом, чтобы использовать полную высоту его родителя. ie.:

html, body { height: 100%; }

Answer 2

Для разделения стилей между IE и FF, Chrome и т. Д. Используйте Условные комментарии .

<!--[if lt IE 9]>
<link href="path-to-file/IE.css" rel="stylesheet" type="text/css" />
<![endif]-->

Это скажет IE использовать таблицу стилей, отличную от IE, FF и других браузеров.

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

Чтобы разделить стили в вашей таблице стилей, используйте это; Это отличный ресурс, который мне очень помог! Селекторы браузера CSS . Это плагин Javascript, который будет читать любые стили, начинающиеся с .webkit, .ie и т. Д., И применять эти стили только к этому браузеру.

Answer 3

Вы пытаетесь расположить свой #show div на 10% ниже его вершины, содержащей div? Если так, попробуйте это:

HTML:

<div id=#your_container>
  <div id=#show>
    Content
  </div>
</div>

CSS:

#your_container {height: 200px; position: relative}
#show {top: 10%; position: absolute}

Answer 4

Можете ли вы также предоставить соответствующую HTML-разметку? И какую версию IE вы используете.

Одной из проблем может быть дополнительный стиль CSS, который наследует элемент с идентификатором 'show'.