Support » Themes and Templates » Gridiculous- menu (site-navigation) can't center

  • Resolved vampirefish

    (@vampirefish)


    Hello. I’m using Gridiculous and am unable to center my main menu (which is placed under my logo/header). For the life of me, I just can’t get this to work- it’s set to the left. I found an earlier post that suggested the following:
    All you need to do is modify the CSS in style.css. Look for this selector:

    #site-navigation ul
    Then you can add a new line of CSS setting the text-align to center, like so:

    #site-navigation ul {
    padding: 0;
    margin: 0;
    text-align: center;
    }

    This has not worked for me. I’m using Gridiculous v1.0.7.1 and WP v3.5. Any suggestions?

Viewing 15 replies - 1 through 15 (of 26 total)
  • Moderator Andrew Nevins

    (@anevins)

    Forum moderator

    Try;

    #site-navigation ul {
     display: table;
     margin: 0 auto;
    }

    By the way, you should never edit the theme’s files.
    Modifications to the theme’s files will compromise the theme and those same changes when the theme updates.

    Instead, use a Child Theme or the Jetpack plugin‘s Custom CSS functionality.

    Thanks – that totally worked! I’m making these changes in the css file, via the editor (but keeping track as I do realize updates will change things). Not sure of any other work around for this as I don’t think any one theme will entail all that I need.

    Also, thanks so much! I’m definitely going to use a child theme!

    Hey… how can I change the color of the site menu text? BTW- child theme is AWESOME- thanks!!!

    Hi, I was hoping you guys could fill me in on centering my menu-bar content. I have tried both of the methods outlines above with no result. When I add it to my child theme it turns the whole menu bar into unformatted text. When I add it to the original themes style.css there are no changes.

    I have tried both replacing the #site-navigation ul with the new one, and adding the new one under it with and without indents. No luck. Any help would be greatly appreciated! Thanks so much

    Anthony

    WPyogi

    (@wpyogi)

    Forum Moderator

    No way to help with CSS without seeing your site – can you post a link to it?

    Hi, here is the link

    http://www.synergycarbon.com

    please exvuse that everything is edited in the original theme’s style.css right now. Thanks for your help!

    WPyogi

    (@wpyogi)

    Forum Moderator

    You have a maintenance mode page up :(. Also, please take the advice above regarding modifying theme files – that’s really not a good idea – you will lose all your work when the theme is updated.

    Hi @wpyogi, thanks for the reply. The Maintenance mode has been removed, sorry about that!! I will keep it off from now on since the content of the site will be be presentable by work hours tomorrow.

    two questions:

    1 – the above about centering the menu items.

    2 – Do you know how I can remove the 80px space between the top of my banner and the top of the website? It is designated for the Site Title and Logo, but i won’t be needing that and the space is ugly. Can’t find that padding code anywhere.

    Thanks so much for your help and patience!! Cheers

    Moderator Andrew Nevins

    (@anevins)

    Forum moderator

    Where did you add the CSS modification I first mentioned?

    I’ve tried it three ways: under the original #site-navigation ul script, replacing it completely, and inside the UL script. Hasn’t worked any of the ways.

    I was also hoping to get some tips on child themes. I had made one, used the @import command to import the parent theme, and then tride adding css edits after that but nothing would change. If I just copy and paste the whole css, will that work? Will it still be safe with updates? Thank you!

    WPyogi

    (@wpyogi)

    Forum Moderator

    No, do not copy the entire parent style.css file – it just creates duplicate code and makes it harder to keep track of what you have changed. If changes are not working, you either have errors or your CSS is not specific enough or something else is wrong.

    I would suggest getting the child theme set up NOW before you do more work that you will have to redo in the child theme. If it’s not working, we can help you with that and then attend to the additional changes you want to make.

    Alright, thanks so much, I’m starting to get to work on the child theme. First thing: when I do the @import command I don’t actually see anything. In the appearance editor I don’t see any .php files, nothing, just the style.css with the only content being the child theme’s name and the @import command. Do I have to do all edits in the webspace explorer? Thank you!

    WPyogi

    (@wpyogi)

    Forum Moderator

    Looks like your child theme is working fine :). You will need to redo some settings and options in the child theme – they don’t all carry over from the parent theme.

    And you just add CSS changes to the style.css file below the @import line – yes.

    Hey thanks for the replies! But my child theme is completely unformatted, didn’t carry over any css for some reason. Something wrong? Thanks!

Viewing 15 replies - 1 through 15 (of 26 total)
  • The topic ‘Gridiculous- menu (site-navigation) can't center’ is closed to new replies.