2010-05-06 36 views
9

Bất cứ khi nào tôi tìm thấy IE hiển thị trang web của tôi lạ (khác với chrome và firefox), tôi thử đặt một zoom:1 trong lớp css cho phần đang được hiển thị lạ. Rất nhiều lần khắc phục sự cố này và làm cho nó trông phù hợp với các trình duyệt khác.Bạn có thể sử dụng zoom: 1 trong các lớp css của tôi không?

Có vấn đề khi sử dụng zoom:1? Tôi biết CSS của tôi sẽ không xác nhận, nhưng có bất kỳ vấn đề thế giới thực nào có thể phát sinh nếu tôi dựa quá nhiều vào việc sử dụng zoom:1 không?

Trả lời

17

Sự cố bạn đang tranh cãi với vấn đề này là sự cố IE hasLayout. Here là một bài viết hay và tổng quan về các thuộc tính nào cũng kích hoạt "có Bố cục" trong IE.

Tôi biết không có tác dụng phụ nào đối với zoom: 1 ngoại trừ việc nó không phải là W3C hợp lệ. Tôi khá chắc chắn rằng tôi đang sử dụng nó bản thân mình trong một số dự án. Tuy nhiên, dĩ nhiên, có một cơ hội từ xa là zoom trở thành tài sản CSS thực sự một ngày - hoặc được sử dụng trong ngữ cảnh độc quyền khác như trên iPad hoặc bất kỳ thứ gì - điều này có thể dẫn đến sự cố.

Thực sự sạch giải pháp, thu phóng không được. Nếu có thể, tốt hơn là nên đưa phần tử "Bố trí" theo cách khác như được nêu trong bài viết.

+3

Bạn có thể giảm thiểu bất kỳ nhược điểm bằng cách sử dụng ý kiến ​​có điều kiện để chỉ phục vụ 'quy tắc zoom' cho IE-7-hoặc-thấp hơn. (Công cụ bố trí của IE8 hoạt động khác và có xu hướng không thể hiện cùng một loại vấn đề.) – bobince

0

thu phóng chỉ được hỗ trợ bởi IE, do đó, không phải tại thời điểm này. Có khả năng có thể là một tài sản trong tương lai được gọi là phóng to mà có thể gây rối mọi thứ, nhưng điều này là không chắc chắn do sử dụng rộng rãi.

+1

Thu phóng giờ đây cũng được Chrome và Safari hỗ trợ, theo trang web này: http://css-tricks.com/almanac/properties/z/zoom / – thenickdude

0

display: inline-block; làm điều tương tự, nhưng là mã chuẩn.

Trong trường hợp hiếm nó tạo ra một vấn đề, bạn có thể sử dụng

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

để gửi nó chỉ để các phiên bản cổ xưa của trình duyệt Internet Explorer mà nó rất hữu ích.

1

Ngược lại, có những nhược điểm dứt khoát khi sử dụng thu phóng: 1, ngay cả trong IE. Thông thường, tôi chỉ đưa nó vào biểu định kiểu chỉ có IE, nhưng ngay cả trong vài ngày qua tôi đã vật lộn với một số vấn đề bố cục vì tôi đã chọn sử dụng * {zoom: 1;}

- takeaway - use nó trên cơ sở hạn chế. Nếu bạn chỉ quan tâm đến IE7 +, bạn có thể sử dụng min-height: 1%, có cùng tác dụng kích hoạt hasLayout

Các vấn đề liên quan