IE가 IE에서 웹 사이트를 이상하게 보일 때마다 (크롬과 파이어 폭스와 다름) 나는 zoom:1을 CSS 클래스에 넣어 이상한 것으로 보입니다. 많은 시간이 문제를 해결하고 다른 브라우저와 일관되게 보이게합니다.내 CSS 클래스에서 zoom : 1을 사용해도 되나요?
zoom:1을 사용하는 데 문제가 있습니까? 내 CSS가 유효성을 검사하지 않을 것이라는 것을 알고 있지만 zoom:1을 너무 많이 사용하면 실제로 발생할 수있는 문제가 있습니까?
이 문제와 관련된 문제는 IE hasLayout입니다. Here은 IE에서 "등록 정보"가 트리거되는 좋은 기사 및 개요입니다.
zoom: 1에 부작용이없는 것으로 알고 있습니다 만 W3C가 유효하지 않습니다. 나는 몇몇 프로젝트에서 직접 사용하고 있다고 확신한다.
그러나 언젠가는 zoom이 실제 CSS 속성이되거나 iPad 등 다른 독점적 인 컨텍스트에서 사용되면서 일이 깨질 수있는 원격 기회가 있습니다.
정말로 깨끗한 해결책은 해결책이 아닙니다. 가능한 경우 기사에 설명 된대로 다른 방식으로 "레이아웃"요소를 제공하는 것이 좋습니다.
줌은 IE에서만 지원되므로 현재로서는 지원되지 않습니다. 잠재적으로 물건을 엉망으로 만들 수있는 zoom이라는 미래의 속성이있을 수 있지만 널리 사용되기 때문에 가능성은 낮습니다.
줌은 현재 Chrome과 Safari에서이 사이트에 따라 지원됩니다. http://css-tricks.com/almanac/properties/z/zoom / – thenickdude
display: inline-block;도 똑같지 만 표준 코드입니다. 이 문제를 생성 드문 경우
, 당신은 단지 그것을 유용하는 인터넷 익스플로러의 고대 버전에 보낼
display: block !important; /* or inline, etc. */
display: inline-block; /* in this order */
를 사용할 수 있습니다.
반대로 IE 에서조차도 zoom : 1을 사용하는 데있어서 확실한 단점이 있습니다. 일반적으로 IE 전용 스타일 시트에만 포함 시키지만, 지난 며칠간 나는 * {zoom : 1;}을 사용하기 때문에 몇 가지 레이아웃 문제를 다루었습니다.
- 테이크 아웃 - 사용 그것은 제한된 기준으로 IE7 + 만 신경 쓰면 최소 높이 : 1 %를 사용할 수 있습니다. hasLayout과 동일한 효과가 있습니다.
2012 년 11 월 현재 언젠가 줌이 유효한 CSS가 될 가능성이 더 커집니다 위 컨텍스트에서이를 사용하면 부작용이 없어야합니다.
참조 : http://dev.w3.org/csswg/css-device-adapt/ 또는 http://www.w3.org/TR/css-device-adapt/
당신은 IE-7 또는-아래에'zoom' 규칙을 제공하기 위해 조건부 주석을 사용하여 모든 단점을 완화 할 수 있습니다. (IE8의 레이아웃 엔진은 다르게 작동하며 같은 종류의 문제를 나타내지 않습니다.) – bobince