PDA

View Full Version : Can't get my navigation to center



miker1961
24 Jul 2008, 10:36 AM
For some reason I cannot seem to get this simple inline unordered list centered within my design. The entire navigation is styled using CSS and it is really straightforward however, the entire thing always aligns to the left. I want it to center left to right within the div that it is sitting. Can someone give me some advice.

http://www.efotolab.com/home.htm

Thanks
Mike

Wickham
24 Jul 2008, 02:10 PM
All your menu buttons have no width, so they are flexible in width, but you can't centralise something that has no width in the normal way by setting auto margins.

Your buttons need different widths for different text, so make an id for each with a different width, then make dummy li tags for the two ends. If you don't provide dummy links at the ends the menu bar will be shorter than the page width and you can centralise with a left margin, leaving a space each side which is not green, but perhaps that is what you want. I've assumed that the green color goes full width of the page.

See
http://www.wickham43.supanet.com/forumposts/mikerhome080724.html
and the css file:-
http://www.wickham43.supanet.com/forumposts/mikerhome080724.css

You can adjust the widths to make the buttons less wide but then make the sides class wider for each side. I should have calculated everything to fit precisely, but to save time I just set the sides class by eye, widening it gradually until they filled the remaining space each side.

I changed the image and css file urls to suit my directory/folder structure so you will need to adjust these.