cc3 and <li> issue in IE

[Guest Lunnmh]

http://www.thorondor.co.uk/upload/

Hey,

This is just a test site so i can alter the template as much as possible and hopefully if any issues arrise the veterains of this forum can help , because if all goes well i aim to use this product alot.

I have a problem with the <li> in the navigation as my code is telling it there is no list style or padding but although it removes the list style it still keeps the spacing a <li> would use by default.

I have used the below code in a seperate html page and it worked fine (just tried 2 secs ago). it also works fine in firefox, just in IE it acts as if it still has a list style applied.

Any suggestions.

The Navigation on the left is in this code:

<div class="navLinks">

<ul>

<li><a href="http://www.thorondor.co.uk">Home</a></li>

<li><a href="#">Cushions</a></li>

<li><a href="#">Bags</a></li>

<li><a href="#">Keepsake Bags</a></li>

<li><a href="#">Boards</a></li>

<li><a href="http://www.thorondor.co.uk/upload">Online Shop</a></li>

</ul></div>

and the css code is:

.navLinks {

width: 130px;

margin: 0px;

padding: 0px;

font-size: 12px;

}

.navLinks ul { list-style-type:none; margin: 0px; padding: 0px;}

.navLinks li { margin: 0px; padding: 0px;}

.navLinks li a{

display:block;

width:115px;

font-family:Arial, Helvetica, sans-serif;

color: #000000;

font-size: 12px;

margin: 0px;

padding: 0px;

text-decoration:none;

}

.navLinks li a:hover { color: #000000; background-color: #F3F3F3;}

.navLinks li a:active {color: #FFFFFF; background-color: #4B74B9;}

[Guest Lunnmh]

fixed <li> problem in IE incase anyone gets same problem.

I had to change the <li> property in style.css from inside to none.

li {

list-style-position: inside; (changed to none)

margin: 0px;

padding: 0px;

}

After this fixed it, it created an error for one of the boxes but to then fix that you just need to apply the same list-style-position: inside to the li.bullet class and that fixes that.

li.bullet {

list-style-position: inside; (add this line)

list-style-type: square;

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 70%;

color: #000000;

}

;)

[Guest]

maybe this tutorial on projectseven.com helps ... they always produce fine working css code include the bloody IE ... :)

[Guest Lunnmh]

cheers for tutorial but it was more that cc3 was telling the <li> to do something from a different style sheet that IE got confused (as it tends to)

The code worked fine as i used it externally, it was just i was using the layout.css and noticed the additional code in style.css.