Div дисплей: начальный не работает, как предполагалось в ie10 и chrome 29

Question

Div дисплей: начальный не работает, как предполагалось в ie10 и chrome 29

Я хочу отобразить div со следующими ограничениями:

автоматически скрывается под шириной 1024px

можно переключать кнопкой под шириной 1024px, но если я нажму somwhere (не внутри div), класс activeDiv должен быть удален

У меня есть фиктивный пример в codepen

Таким образом, возникли следующие проблемы:

в IE10 кнопка переключения просто не работает (не Скрыть / показать div) я проверяю с помощью инструментов разработчика, но никаких признаков display: initial

в Chrome 29 div появляется рядом с кнопкой не под ней. (Firefox-то же самое)

Я знаю, что по умолчанию display для div является block, но этот css не только для тегов div, поэтому я стараюсь использовать initial.

443 2

html css css3

2 ответов:

Comments

Ничего не найдено.

BoltClock · Accepted Answer · 2013-09-17 16:52:32

initial означает ли не "значение по умолчанию данного свойства для данного элемента". Это означает "значение по умолчанию данного свойства, как определено спецификацией". Начальное значение display равно inline, а не block, как указано здесь. Это не зависит от того, к какому элементу вы его применяете. И, как уже упоминалось, IE не поддерживает ключевое слово initial.

Если вы хотите, чтобы элемент отображался как блок, используйте display: block. Если вы хотите, чтобы он отображался в строке, используйте display: inline. Если вы хотите, чтобы он использовал то, что является браузером по умолчанию для него, Не устанавливайте свойство display вообще.

urz0r · Accepted Answer · 2013-09-17 16:35:28

Что вы подразумеваете под этим?

Этот css не только для тегов div

Display: initial - CSS3 и не поддерживается IE10. Если не указано правило отображения, от которого оно может наследовать, оно будет возвращено к display: inline.
display:block;
display:initial;
Предоставляет резервный дисплей: блок.