Come together with the global Drupal community in Rotterdam, 28 Sept – 1 Oct 2026. Sessions, contribution, connection, and Early Bird savings until 8 June.Is there a way to center the links on my primary navigation menu, such as editing some part of the CSS file(s)? I have a screenshot posted below with what I would like to do.
Comments
Comment #1
vm commentedyou didn't attach screenshot
use the firefox browser with the firebug addon to help you figure out which div you need to look at , and which css will need to be altered.
Comment #2
GreatLakesWeb commentedHere...I'll use that addon, thanks!
Comment #3
GreatLakesWeb commentedokay apparently i can't get the shot to post...disregard
Comment #4
vm commentedComment #5
GreatLakesWeb commentedI'm going to reopen this one. I still haven't figured out how to fix that, even with the firebug. I'm not sure which part of the code needs to be fixed (CSS, HTML, etc.) and what the code should be/look like.
Comment #7
john.kenney commentedI think you have to find the CSS for 'ul' element for that menu and add 'text-align: center;' to it (since you can't 'float: center;'). I
f you can find the ID, then you may want to assign specifically to it to avoid screwing up other menus.
Example CSS from the footer menu I centered the other day.
#block-menu-menu-footer-menu ul {
text-align: center;
padding: 6px 15px;
}
As previous poster suggests, easiest way to find the specific element and applicable CSS is with firebug. Else pretty much impossible as IDs and classes for menus are assigned automatically by Drupal.
Comment #8
john.kenney commentedSorry, to clarify.
If you want to assign to the specific ID, there may not be any CSS specific to that 'ul'. Existing CSS may all be inherited from more general selectors. In which case, you just add it in the format of my example.
Comment #9
jacineThanks everyone for jumping in to help... I've really been crazy busy lately, so I really appreciate the help in here more than you know ;o)
rutilaurology.com,
You can't do this, due to a float that is set on the navigation menu. If you know enough CSS to do this, feel free, otherwise you'll have to wait about a week or two (I only have weekends to work on the theme at this point). This is actually one of the very cool enhancements that I'm currently making to the theme. You'll be able to choose from the backend how you want it aligned.
Comment #10
GreatLakesWeb commentedAwesome! I think I can wait a little bit, but I'm trying to get the site online by the end of May. Thanks for your help.
Comment #11
jacineThe 6.x-2.x-dev version now includes a setting to set the alignment of the navigation from the theme settings page. It also includes suckerfish style drop-down menus now. It should be available on the project page for download shortly.
Comment #12
ntripcevich commentedI found that the default 100px Height of Header forced my Primary Links off to the right on some browsers/computers if I used a larger font size. Enlarging Height of Header to 120px in Theme > Configure > Sky allows room for the Primary Links menu to be centered.