I am in need of help right away. I cannot center the text in my menu. I have added text-align: centered; Code (markup): and it does not work. I will pay someone five dollars right now through paypal to help me. Please respond here or in pm for the url. Thanks!
Would you post the URL here so that we can look at it - I'm sure someone will tell you what to do without you having to spend $5.
I can't post the url here. That is why I asked for someone to pm me. Do you know how to do it? I will send you the url in a pm or the css.
Here is the CSS for the navigation. /*Navigation Style*/ #main_nav { position: relative; width: 100%; height: 40px; background: url(images/nav_bg.jpg) repeat-x scroll 0 0; } #main_nav ul li { display: block; float: left; } #main_nav ul li span { width: 2px; height: 4px; background: url(images/main_nav_sep.jpg) no-repeat scroll 0 0; } #main_nav ul li a { font: bold 17px/17px Arial, Helvetica, sans-serif; color: #FFFFFF; text-align: centered; text-shadow: 0 2px 2px #0378d2; /*margin: 0px 86px, 0px 86px;*/ margin: 0px 14px 0px 14px; } #menu-item-21 .sep { display:none; } .current-menu-item a { /*text-decoration: underline;*/ } #main_nav ul li a:hover { text-decoration: underline; } #main_nav .nav_ext { position: absolute; display: block; width: 32px; height: 81px; } #main_nav .nav_right { background: url(images/nav_right.png) no-repeat scroll 0 0 transparent; top: 0; right: -32px; } #main_nav .nav_left { background: url(images/nav_left.png) no-repeat scroll 0 0 transparent; top: 0; left: -32px; } Code (markup):
Floated menus cannot be centered unless you have a crappy inaccessible fixed width on every element and UL itself... It is likely about half that CSS has to be pitched in the trash just to center the menu. ...and if you can't show the URL it's unlikely anyone can offer real help as snippets are useless; though the markup the CSS is being applied to might help a little; CSS without the markup it's applied to is gibberish. ... of course being turdpress, the markup for that menu is likely a class-heavy terrifying mess of ineptitude since they LOVE to shove ineptly coded garbage down your throat.
"centered" is not a valid text-align value. Should be "center" I'm surprised nobody mentioned that yet.
Not that it matters since this: #main_nav ul li { display: block; float: left; } Code (markup): ... means text-align isn't gonna do anything. ... and is nonsensical since floats are inherently block!
Remove the {width: 33%;} from li and see what happens. Yours is a fragile, specific case fix. cheers, gary
@OP For a general case method, try this: ul { padding: 0; /*removes the indent*/ list-style: none; text-align: center; } li { display: inline-block; margin: 0 1em; } Code (markup): cheers, gary //edit: My apologies. I did not notice this is 3 weeks old. Curse you dp and your catastrophic failures.