Можно ли использовать zoom:1 в моих классах CSS?

Всякий раз, когда я нахожу, что IE отображает мой сайт странно (отличается от Chrome и Firefox), я стараюсь zoom:1 в классе CSS для части, которая отображается странно. В большинстве случаев это решает проблему и делает ее похожей на другие браузеры.

Это проблема для использования zoom:1? Я знаю, что мой CSS не будет проверяться, но есть ли реальные проблемы, которые могут возникнуть, если я слишком полагаюсь на использование zoom:1?

5 ответов

Решение

Проблема, с которой вы боретесь, это IE hasLayout вопрос. Вот хорошая статья и обзор о том, какие свойства также вызывают "наличие макета" в IE.

Я не знаю никаких побочных эффектов zoom: 1 кроме того, что это не W3C действительный. Я уверен, что использую это сам в некоторых проектах.

Тем не менее, есть, конечно, небольшой шанс, что zoom однажды станет настоящим CSS-свойством - или будет использован в другом проприетарном контексте, например, на iPad или чем-то еще, - что может привести к поломке.

Действительно чистое решение, зум нет. Если это вообще возможно, хорошей идеей будет дать элемент "Макет" другим способом, описанным в статье.

По состоянию на ноябрь 2012 года все более вероятно, что zoom когда-нибудь станет действительным CSS, хотя кажется, что использование его в вышеуказанном контексте не должно иметь никаких негативных побочных эффектов.

Смотрите: http://dev.w3.org/csswg/css-device-adapt/ или http://www.w3.org/TR/css-device-adapt/

Наоборот, есть определенные недостатки в использовании zoom:1, даже в IE. Обычно я включаю его только в таблицы стилей только для IE, но даже в последние несколько дней я сталкивался с некоторыми проблемами с макетом, потому что решил использовать * {zoom: 1;}

- вынос - используйте его на ограниченной основе. Если вы заботитесь только о IE7+, вы можете использовать min-height: 1%, что имеет тот же эффект, что и запуск hasLayout.

display: inline-block; делает то же самое, но это стандартный код.

В редких случаях это создает проблему, вы можете использовать

display: block !important; /* or inline, etc. */ 
display: inline-block; /* in this order */

отправлять его только в древние версии Internet Explorer, для которых это полезно.

Зум поддерживается только IE, так что пока нет. Потенциально может существовать будущее свойство zoom, которое может испортить ситуацию, но это маловероятно из-за широкого использования.

Другие вопросы по тегам