Got this in my css how to center my links..

I am trying to center my navigation links on my website www.hpkmedia.com with no success.. the css text is below yet when I try to edit the different "left" s to "center" it doesn't work I am not sure how to make my navigation center can anyone help me

 

All I see are floats? You need to put text-align: center; in the #nav. Should cascade down.

 

You are correct

float can only be left or right

 

You can center it by having a div around the floats with an absolute width with the style - margin: 0 auto;

 

^That would center the menu so long as the menu had a width. But I thought we were trying to center the actual a's?

ul.nav li a,ul.nav li a:link,ul.nav li a:visited{border-bottom:0;border-left:0;background:#f3f2ed;color:#069;float:left;display:block;text-decoration:none;padding:0 10px;}

This stuff above needs to go. No need to say display: block if you're floating it (float makes a block), no need to float the a's if the li's are floated, no need to set borders to 0 unless there were borders set on an a somewhere earlier in the code (which, maybe that's true).

 

the flow can only be left or right, instead of using float you can easily you <center> or padding and margin

 

I tried what i could but couldnt fix it

Stomme poes do you mean to delete that code?

 

I tired what you said and it didnt seem to work anyone else got some suggestions?

 

Show the code for that section that you have now. It is the top nav on the site?

 

The code in the first post is what it is currently. Yes it is for the top nav on the site

 

Changed this line display:block to display:inline; :
ul.nav li a,ul.nav li a:link,ul.nav li a:visited {border-bottom:0; border-left:0; background:#f3f2ed; color:#069; display:inline; text-decoration:none; padding:0 10px;}

Add text-align:center; to the #nav :
#nav{height:30px;line-height:30px;padding:0;text-align:center;}

And it works in FF2.

 

I added it but didnt seem to work this is what my code looks like as of right now

 

Take the float:left; out too.

ul.nav li a,ul.nav li a:link,ul.nav li a:visited{border-bottom:0; border-left:0; background:#f3f2ed; color:#069; display:inline; text-decoration:none; padding:0 10px;}

 

Here's a hacky way to fix it -

replace -
#nav{height:30px;line-height:30px;padding:0;text-align:center;}
with -
#nav{height:30px;line-height:30px;padding:0;padding-left: 25px;text-align:center;}


edit: shallowink's way seems to work and is less hacky than mine.

 

Yea I suppose I could do it this way too lol didnt think of that yet I dont think its the best solution

 

Now, without the HTML the CSS is pretty much gibberish, BUT, I've got the feeling that you've got WAY too much CSS and HTML for your own good here.

I'm assuming #nav is a div wrapping the UL - so we can axe that straight off and style the UL directly - making IT the #nav. You're declaring text decoration about five times more than you need to, have a whole bunch of psuedoclass definitions that do NOTHING...

Assuming #nav was a wrapping div, delete any classes that are not 'uniques', make the UL id="nav", and we can simplify down to this:

* {
	margin:0;
	padding:0;
}

#nav {
	list-style:none;
	height:30px;
	font:bold 12px/30px arial,helvetica,sans-serif;
	text-transform:uppercase;
}

#nav li {
	display:inline;
}

#nav a {
	float:left;
	text-decoration:none;
	padding:0 10px;
	color:#069;
	background:#f3f2ed;
}

#nav a:hover,
#nav a:active,
#nav .current_page_item a {
	color:#555;
	background:#fff;
}

#nav .home a {
	border-left:2px solid #fff;
}

#nav ul {
	float:left;
}

Code (markup):

Which is functionally identical to your original CSS - NOT that I can tell what that CSS is even trying to accomplish without the HTML that goes with it.

Fun that it's two-thirds the size yet has full on formatting.

As to centering, that's the float biting you in the backside. Generally if this is a cascading menu, that means for centering unless you fix the width of the UL and all the LI, you are likely shit out of luck unless you force centering with .js

Another reason I've given up on cascading menus (well, that and my increasingly arthritic hands can't seem to navigate the damned things anymore)