Это должно хорошо использовать zoom:1 в моих классах CSS?
Каждый раз, когда я нахожу, что IE отображает мой странный веб-сайт (отличающийся от хрома и Firefox), я пытаюсь поместить a zoom:1 в классе CSS для части, которая отображается странная. Много времени это решает проблему и заставляет ее выглядеть согласовывающейся с другими браузерами.
Действительно ли это - проблема для использования zoom:1? Я знаю, что мой CSS не проверит, но является там любыми проблемами реального мира, которые могут возникнуть, если я полагаюсь слишком много на использование zoom:1?
4 ответа
Проблема, с которой вы боретесь, это проблема IE hasLayout. Вот хорошая статья и обзор того, какие свойства также вызывают "наличие макета" в IE.
Я не знаю никаких побочных эффектов для zoom: 1, кроме того, что он не является W3C валидным. Я почти уверен, что сам использую его в некоторых проектах.
Однако, конечно, есть вероятность, что zoom однажды станет реальным свойством CSS - или будет использоваться в другом собственном контексте, например, на iPad или еще где-нибудь - что может привести к поломке.
По-настоящему чистым решением, zoom не является. Если это вообще возможно, хорошей идеей будет придать элементу "Layout" какой-нибудь другой способ, как описано в статье.
zoom поддерживается только в IE, так что на данный момент нет. Потенциально в будущем может появиться свойство zoom, которое может все испортить, но это маловероятно из-за широкого использования.
display: inline-block; делает то же самое, но является стандартным кодом.
В редких случаях, когда это создает проблему, вы можете использовать
display: block !important; /* or inline, etc. */
display: inline-block; /* in this order */
чтобы отправить его только в древние версии Internet Explorer, для которых он полезен.
Напротив, у использования масштабирования есть явные недостатки: 1 даже в IE. Обычно я включаю его только в таблицы стилей IE, но даже в последние несколько дней я боролся с некоторыми проблемами макета, потому что я решил использовать * {zoom: 1;}
- вынос - используйте его на ограниченной основе. Если вас интересует только IE7 +, вы можете использовать min-height: 1%, что дает тот же эффект, что и запуск hasLayout