Safari và Chrome bỏ qua CSS chiều rộng tối thiểu

Question

Tại sao Safari và Chrome bỏ qua thuộc tính CSS tối thiểu? Ví dụ http://jsfiddle.net/8YFHu/2/ Tính năng này hoạt động trong IE và Firefox nhưng không hoạt động trong Safari và Chrome.

Answer 1

Chrome và Safari chỉ đơn giản là không hỗ trợ thuộc tính min-width trên table yếu tố. Tuy nhiên, họ sẽ tôn trọng min-width khi áp dụng cho các ô trong bảng.

Sau một số thử nghiệm nhanh chóng, dường như hỗ trợ như sau:

• Firefox: Hỗ trợ (thử nghiệm trong 5, không chắc chắn kể từ khi phiên bản nào)
• Internet Explorer: hỗ trợ (kể từ IE8. IE7 trở xuống dường như không hỗ trợ nó)
• Chrome: Không được hỗ trợ (tất cả các phiên bản theo như tôi có thể biết)
• Safari: Không hỗ trợ (tất cả các phiên bản như xa như tôi có thể nói)
• Opera: Hỗ trợ (thử nghiệm trong 11,5, không chắc chắn kể từ khi phiên bản nào)

Thông tin thêm có thể được tìm thấy trong MDN article trên thuộc tính, mặc dù bài viết cho rằng thuộc tính không được hỗ trợ trong IE, mặc dù nó là từ IE8.

Các CSS2.1 specification khẳng định rằng min-width (và max-width cho rằng vấn đề) áp dụng đối với:

tất cả các yếu tố nhưng yếu tố inline không thay thế, hàng bảng, và chèo nhóm

Vì vậy, nó sẽ có vẻ như Chrome và Safari là những cái không phù hợp với tiêu chuẩn.

Sửa

Sau khi chỉ nhìn một chút nữa xuống phần có liên quan của spec, tôi nhận thấy sau đó nó khẳng định:

Trong CSS 2.1, ảnh hưởng của 'min-width' và 'chiều rộng tối đa' trên các bảng, các bảng nội tuyến, các ô bảng, các cột trong bảng và các nhóm cột là không xác định.

Vì vậy, nó thực sự trông giống như không ai nhận nó sai, và tất cả mọi người chỉ có thể làm việc của riêng họ.

Answer 2

Theo kinh nghiệm của tôi, việc xác định độ rộng trên các phần tử td thường không thực tế. Cách giải quyết tốt nhất mà tôi đã tìm thấy cho giới hạn này là đặt chiều rộng tối thiểu trên phần tử div chứa cho bảng.