equal spacing nav ul

[Dal123]

Very basic error that I still do not understand, I have unordered list for my nav bar.
Ideally I would just set a width of them but that does not seem to work, last time I did this on my .co.uk site and it worked. But I am following everything from my site and it does not work.
it is viewable here http://www.preciseformwork.co.uk/new-site/index1.htm
any input appreciated.

html

<ul id="nav-list">
	<li><a href="index.htm">home</a></li>
	<li><a href="services.htm">services</a></li>
	<li><a href="gallery.htm">previous jobs</a></li>
	<li><a href="links.htm">links</a></li>
	<li><a href="http://www.preciseformwork.co.uk/wordpress">blog</a></li>
	<li class="no-pad"><a href="contact.htm">contact us</a></li>
</ul>

css

#nav-list {
position:absolute;
padding:0;
margin:0;
}

#nav-list li{
position:relative;
display:inline;
padding:0 80px 0 0;
margin:0;
}

.no-pad li{
padding:0;
margin:0;
}

#nav-list a {
text-decoration:none;
font-family: "Lucidia Grande", "Lucida Sans Unicode", "Verdana", sans-serif;
font-size: 20px;
margin:0;
padding:0;
}

 

[CMT]

Your CSS could be simplified a lot!

Let's see if I understood what you want:

#nav-list {
	list-style: none;
	margin: 0; padding: 0;
}
#nav-list li {
	float: left;
	margin-left: 30px;
}
	
#nav-list a {
	text-decoration:none;
	font-family: "Lucidia Grande", "Lucida Sans Unicode", "Verdana", sans-serif;
	font-size: 20px;
}

or, you can use padding on both sides (left and right) of list items, instead of margin like I did.

 

[angelwatt]

It's a specificity issue and a incorrect CSS selector.

.no-pad li

means an li element that is inside an element with a class on no-pad. What you wanted was an li element with a class name of nopad. You don't even ned the li part.

#nav-list .nopad

 

[Dal123]

Thanks angelwatt, I tried similar but with li on the end . Thanks very much buddy.
Also thanks cmt, unfortunately padding on left and right would not achieve what I want. Thanks for input though much appreciated .

 

[CMT]

Ok!

By the way, I always used floats in these situations, but your solution looks great!

CSS sometimes drive you crazy, I think that's normal.

100 lines of CSS generates me 5 times more bugs than if had written 100 lines of Objective-C.

 

[Dal123]

Thanks cmt, some say that css is easy but I strongly disagree. There are a million different ways with all slightly different solutions , read two books on it now and just found out css3 is out lol.