Đặt min-width cho IE6

Như chúng ta đã biết với sự phát triển nhanh chóng của ngành công nghiệp phần cứng, ngày càng có nhiều màn hình có độ phân giải cao. Nó cho phép chúng ta có một không gian làm việc rộng hơn, nhưng đôi khi nó cũng là vấn đề bất cập đối với Website của chúng ta.
Như chúng ta đã biết với sự phát triển nhanh chóng của ngành công nghiệp phần cứng, ngày càng có nhiều màn hình có độ phân giải cao. Nó cho phép chúng ta có một không gian làm việc rộng hơn, nhưng đôi khi nó cũng là vấn đề bất cập đối với Website của chúng ta.

Đối với một số Website vẫn thường để chiều ngang là auto theo chiều rộng của màn hình thì bây giờ tôi nghĩ rằng cần có một chút thay đổi nhỏ.

Chúng ta chỉ đặt chiều rộng Website của mình auto tới một khoảng nhất định (giả sử rằng tới 1024px,…) thì chúng ta sẽ cố định chiều rộng của nó. Điều đó sẽ giúp bạn chủ động hơn trong việc thiết kế giao diện đồ họa của mình, tránh tình trạng Website sẽ bị vỡ khi chiều ngang của màn hình quá lớn.

Để thực hiện điều đó chúng ta sẽ sử dụng thuộc tính max-width trong CSS , nhưng có một vẫn đề ở đây đó là các trình duyệt như Firefox, Opera, Safari,.. thì hiểu nhưng riêng IE6 lại không thể hiểu được thuộc tính này.

Để có thể thực hiện điều đó trên IE6 chúng ta có một giải pháp là sử dụng câu lệnh điều kiện của Javascript và nhúng vào CSS :

content {
height: 75px;
background-color: #000;
color: #fff;
width: expression(document.body.clientWidth < 742? “740px” : document.body.clientWidth > 1202? “1200px” : “auto”);
min-width: 740px;
max-width: 1200px;
}