Chiều rộng tối thiểu trong MSIE 6

Question

Cách dứt khoát là gì để bắt chước chiều rộng tối thiểu của thuộc tính CSS trong Internet Explorer 6? Tốt hơn là không thử?

Answer 1

foo { min-width: 100px }  // for everyone 
* html foo { width: 100px } // just for IE 

(hoặc phục vụ cho một stylesheet riêng biệt để sử dụng IE conditional comments)

Answer 2

làm thẻ css của bạn dưới dạng _Width: 500px hoặc bất kỳ thứ gì.

Answer 3

này hoạt động khá tốt ...

div.container { 
    min-width: 760px; 
    width:expression(document.body.clientWidth < 760? "760px": "auto"); 
} 

Answer 4

This article trên CSS Play, bởi Stu Nicholls, cho thấy các phương pháp khác nhau cho đạt được độ rộng tối thiểu trong IE, trong tất cả các chế độ (Quirks, vv) và thậm chí cho IE/Mac.

Answer 5

Bạn có thể sử dụng biểu thức (như đề xuất của HBoss), nhưng nếu bạn lo lắng về hiệu suất thì cách tốt nhất để làm điều này là thêm một phần tử bên trong phần tử bạn muốn áp dụng chiều rộng tối thiểu.

<div id="container"> 
    The "shim" div will hold the container div open to at least 500px! 
    You should be able to put it anywhere in the container div. 
    <div class="shim">&nbsp;</div> 
</div> 

#container .shim { 
    width: 500px; 
    height: 0; 
    line-height: 0; 
} 

Điều này yêu cầu đánh dấu không phải ngữ nghĩa nhưng thực sự là giải pháp đa trình duyệt và không yêu cầu sử dụng biểu thức.

Answer 6

Min-height fast hack công trình cho tôi (cũng làm việc cho chiều rộng)

Answer 7

Sử dụng ý kiến ​​có điều kiện để tham khảo và MSIE 6 style sheet cụ thể, sau đó tạo ra CSS như dưới đây.

trình duyệt Compliant sẽ sử dụng:

min-width: 660px; 

Sau đó MSIE 6 sẽ sử dụng:

width: expression((document.body.clientWidth < 659)? "660px" : "auto"); 

Answer 8

Tôi đã fiddled với tất cả các câu trả lời đưa ra ở đây trong tháng qua. Và sau khi chơi với phương pháp của Pretaul (Min-width in MSIE 6), nó có vẻ là giải pháp thay thế tốt nhất cho chiều rộng tối thiểu. Không có hack hoặc bất cứ điều gì, chỉ cần thẳng lên mã CSS tuân thủ trong đó mất 30 giây để thực hiện.

Từ Googling xung quanh, các biểu thức có vẻ là phổ biến nhất. Đối với tôi anyways, ittended để ngẫu nhiên khóa lên trình duyệt của tôi (cả IE và FF).

Answer 9

Ví dụ giả định là tốt để buộc trình duyệt hiển thị thanh cuộn ngang khi vùng chứa đến một kích thước nhất định nhưng bạn sẽ nhận thấy rằng nội dung trong vùng chứa sẽ vẫn được thay đổi kích thước khi cửa sổ nhỏ hơn. Tôi tưởng tượng rằng đây không phải là mục tiêu chung khi cố gắng để đạt được chiều rộng tối thiểu trong IE 6.

Incomplete min-width technique http://www.mediafire.com/imgbnc.php/260264acec99b5aba3e77c1c4cdc54e94g.jpg

Bên cạnh đó, việc sử dụng các biểu thức và hacks điên CSS khác chỉ không phải là thói quen tốt. Chúng không an toàn và ô uế. Điều này article giải thích các caveats của hacks CSS và lý do tại sao họ nên tránh hoàn toàn.

Cá nhân tôi coi bài đăng của scaryjeff là lời khuyên tốt nhất để đạt được độ rộng tối thiểu thực trong IE6 và là nhà phát triển bố cục CSS có kinh nghiệm tôi chưa tìm được giải pháp tốt hơn.

article trên CSS Play, bởi Stu Nicholls, hiển thị các phương pháp khác nhau để đạt được chiều rộng tối thiểu trong IE, ở tất cả các chế độ (Quirks, vv) và thậm chí cho IE/Mac.

Tôi đã cung cấp câu trả lời cho một câu hỏi tương tự chi tiết việc sử dụng kỹ thuật này để đạt được độ chính xác tối thiểu. Nó có thể được xem tại đây:

CSS: Two 50% fluid columns not respecting min width

Kỹ thuật này rất đơn giản, CSS hợp lệ mà có thể được sử dụng trong hầu hết các tình huống. Áp dụng cho ví dụ shim ở trên nó kết quả trong những gì tôi cho là đúng chức năng min-width.

Correct min-width technique http://www.mediafire.com/imgbnc.php/a67b2820bfbd6a5b588bea23c4c0462f4g.jpg

Answer 10

I dunno, tôi đã có một số thành công với:

min-width: 193px; 
    width:auto !important; 
    _width: 193px; /* IE6 hack */ 

Một sự kết hợp của Dustin diaz' min-height nhanh Hack & How do I specify in HTML or CSS the absolute minimum width of a table cell

Answer 11

nút đơn dòng

button{ 
background-color:#069; 
float:left; 
min-width:200px; 
width:auto !important; 
width:200px; 
white-space: nowrap}