views:

1526

answers:

4

I am having problems with IE, In FF and Chrome the navigation at the top displays fine. However in IE8 (with or without compatibility) the UL seems to indent from the left hand side, not each li just the whole li; despite declaring text-align:center; width:600px; margin:auto; padding-left:0;.

Any ideas what could be causing this?
Thanks,
Jamie

+6  A: 
margin-left:0px;

In Firefox the UL is padded left by default, in IE it has a left margin.

Example:

<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>
CptSkippy
+3  A: 

I think it should be:

ul { padding: 0; margin: 0 } 
li { padding: 0; }
Richard Lennox
+1  A: 

I just used ul { list-style-position:outside; } to fix the indent in IE.

Steve
A: 

tkx steve, it works with "list-style-position:outside;"

paolo