WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Gridiculous- menu (site-navigation) can't center (27 posts)

  1. vampirefish
    Member
    Posted 1 year ago #

    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?

  2. Andrew
    Forum Moderator
    Posted 1 year ago #

    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.

  3. vampirefish
    Member
    Posted 1 year ago #

    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.

  4. vampirefish
    Member
    Posted 1 year ago #

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

  5. vampirefish
    Member
    Posted 1 year ago #

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

  6. anthonystal
    Member
    Posted 1 year ago #

    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

  7. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

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

  8. anthonystal
    Member
    Posted 1 year ago #

    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!

  9. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    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.

  10. anthonystal
    Member
    Posted 1 year ago #

    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

  11. Andrew
    Forum Moderator
    Posted 1 year ago #

    Where did you add the CSS modification I first mentioned?

  12. anthonystal
    Member
    Posted 1 year ago #

    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!

  13. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    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.

  14. anthonystal
    Member
    Posted 1 year ago #

    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!

  15. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    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.

  16. anthonystal
    Member
    Posted 1 year ago #

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

  17. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    Yes, it does have all the parent styles - try clearing your browser cache - press reload a few times.

  18. anthonystal
    Member
    Posted 1 year ago #

    Alllriiight! And boom: the menu is in the middle! You are awesome (and the rest of you)!

    Does anyone know how I can remove the ugly empty space above my header (between it and the top of the website; +/-80px of emptiness). It is where the Site Title and Logo could go, but I dont need those. Or if that isn't possible, is there any way to have my home page always open to an anchor, 80px below the top?

    Also, for the .php files, to edit them do I copy the whole file from the parent theme into child and do edits there? Or do I do an @import command for that too?

    Thanks so much!!

  19. anthonystal
    Member
    Posted 1 year ago #

    When I copy over header.php all is well, but when I copy over functions.php I get the following message:

    Fatal error: Cannot redeclare gridiculous_link_pages() (previously declared in /homepages/39/d275221934/htdocs/wp-content/themes/SynergyGridiculous/functions.php:523) in /homepages/39/d275221934/htdocs/wp-content/themes/gridiculous/functions.php on line 549

    Thanks in advanced

  20. Andrew
    Forum Moderator
    Posted 1 year ago #

  21. anthonystal
    Member
    Posted 1 year ago #

    Anndd its a wrap! Thanks so much Andrew and WPyogi, you are very kind indeed!

  22. anthonystal
    Member
    Posted 1 year ago #

    Oh sorry, just that one more thing: How to remove the 80 pixels of emptiness above my header banner? It was where the site title and logo could go, but i'd love to remove that empty space. If impossible, can I make an anchor point below those 80 pixels for the page to automatically open at? Cheers!

  23. Andrew
    Forum Moderator
    Posted 1 year ago #

    Try adding to your Child Theme style.css file:

    .header-widget {
     margin: 0;
    }
  24. anthonystal
    Member
    Posted 1 year ago #

    No unfortunately not, thanks for the try though, any other ideas?

  25. Andrew
    Forum Moderator
    Posted 1 year ago #

    Also this:

    #header hgroup {
     display: none;
    }
  26. anthonystal
    Member
    Posted 1 year ago #

    Unfortunately not that one either

  27. Andrew
    Forum Moderator
    Posted 1 year ago #

    It doesn't appear to be in your Child Theme style.css file.

Topic Closed

This topic has been closed to new replies.

About this Topic