2009-07-26 27 views
13

Tôi có thanh điều hướng ở đầu trang. Trong FF và Chrome thanh điều hướng hiển thị tốt. Tuy nhiên trong IE8 (có hoặc không có khả năng tương thích) UL dường như thụt lề từ phía bên tay trái, không phải mỗi li chỉ toàn bộ li; mặc dù tuyên bốCSS khiến cho UL bị thụt lề quá nhiều trong IE

text-align:center; width:600px; margin:auto; padding-left:0; 

Bất kỳ ý tưởng nào có thể gây ra điều này?

Trả lời

22
margin-left:0px; 

Trong Firefox, UL được đệm theo mặc định, trong IE nó có lề trái.

Ví dụ:

<html> 
<head> 
<style> 

ul{ 
border:1px solid red; 
margin:0px; 
list-style:none; 
padding:0px; 
} 

li{ 
border:1px solid green; 
margin:0px; 
} 

</style> 
</head> 
<body> 

<ul> 
<li>this</li> 
<li>that</li> 
<li>these</li> 
<li>those</li> 
</ul> 

</body> 
</html> 
4

Tôi nghĩ rằng nó nên là:

ul { padding: 0; margin: 0 } 
li { padding: 0; } 
15

tôi chỉ sử dụng ul {list-style-position: bên ngoài; } để sửa lỗi thụt lề trong IE.

+0

thích. hầu hết các câu trả lời tôi nhận được là margin: 0, padding 0. Điều này cũng cần thiết cho IE để nó hoạt động giống như các trình duyệt khác. –

+0

Rất hữu ích, cảm ơn! – Makc

+0

Đây là anwser! – Kyobul

0

Sử dụng list-style-position:outside; dành riêng cho IE6/IE7 đã hoạt động đối với tôi. Tuy nhiên, lưu ý rằng điều này chỉ có thể cần thiết nếu bạn đang sử dụng list-style-position:inside; cho các trình duyệt khác và chỉ cần ẩn lề/danh sách mặc định bằng cách đặt chúng thành 0. Làm việc với IE yêu cầu một số sự khéo léo và nhiều CSS dành riêng cho trình duyệt.