Tôi cóĐịnh tâm một ul với nổi li
<div id="container">
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
</div>
Với CSS sau đây:
#container li {
float:left;
height:33px;
line-height:30px;
text-align:center;
width:auto;
}
#container{
width:600px;
}
Tuy nhiên tôi đang gặp khó khăn trong việc theo chiều ngang trung các ul bên #container
. Có vẻ như tôi cần đặt chiều rộng cố định trên ul cho margin: 0 auto
để hoạt động (cần text-align: center
đối với IE). Tuy nhiên tôi không muốn đặt chiều rộng cố định cho ul vì các mục li sẽ là động.
Vui lòng thông báo.
Cảm ơn bạn nhưng không inline-block không hoạt động trong IE6 (và IE7?)? – cadaa
Bạn có thể thử mẹo này để làm cho nó hoạt động với IE (Tôi không thể xác minh xem nó có hoạt động hay không, như tôi đang sử dụng máy Mac ngay bây giờ). Thêm phần này vào '#container ul': 'zoom: 1; * Hiển thị: nội tuyến; 'Lý do đằng sau điều này được giải thích ở đây: http://blog.mozilla.com/webdev/2009/02/20/cross-browser-inline-block/ –