Giá trị Z-Index CSS tối đa

Một vài tháng trước, tôi đã khởi chạy một trang web mới và nhận được đơn khiếu nại rằng quảng cáo hình chữ nhật dài xuất hiện phía trên trình đơn thả xuống mà tôi đã có trên trang. Đủ đơn giản, tôi đã kiểm tra css của quảng cáo, thấy rằng nó có chỉ số z là 999 và tăng chỉ số z trên menu lên 1.000. Đã giải quyết được sự cố. Cùng một vấn đề nữa một vài tuần sau đó, nâng lên 10.000. Một lần nữa hôm nay tôi đã phải kiểm tra một quảng cáo khác đã gây ra cùng một vấn đề. Nó có chỉ số 1 triệu. Thật khó chịu.

Điều đó khiến tôi băn khoăn, giá trị tối đa mà tôi có thể thiết lập một chỉ số z là gì. Nhìn vào tài liệu CSS khác nhau, dường như không có giá trị tối đa nào được chỉ định. Câu trả lời, trong Firefox, IE và Chrome là:

2147483647

Đó là giá trị được ký tối đa của một số nguyên 32 bit. Về mặt kỹ thuật, tôi sẽ tưởng tượng giới hạn này xuất phát từ ngôn ngữ lập trình mà trình duyệt đã được tạo. Tôi chắc chắn có một số trình duyệt cũ hơn, nơi đặt giá trị này thành giá trị có thể làm hỏng. Thú vị thứ mặc dù. Vì vậy, nếu bạn muốn chắc chắn rằng phần tử của bạn là hoàn toàn chắc chắn 100% trên đầu trang, thiết lập nó để 2147483647. Vấn đề được giải quyết. Tuy nhiên, trong thực tế, tôi thấy rất khó chịu khi một quảng cáo đã đặt nó thành một con số cao như vậy. Xem xét trên bất kỳ trang nhất định, sẽ có một số lượng rất hạn chế của các lớp, đặt nó vào một số lượng nhỏ hơn nhiều nên làm các trick.

Xem Thêm