• Skip to main content
  • Skip to forum navigation

StudioPress

  • Shop for Themes
  • My StudioPress

Forum navigation

  • Home
  • General Genesis Discussions
  • StudioPress Themes
  • Genesis Blocks
    • Genesis Blocks
    • Genesis Custom Blocks
  • Retired Themes
  • FAQs
  • Forum Rules
  • Internationalization and Translations
  • Forum Bugs and Suggestions
  • Forum Log In

Are You Using The WordPress Block Editor?

Genesis now offers plugins that help you build better sites faster with the WordPress block editor (Gutenberg). Try the feature-rich free versions of each plugin for yourself!

Genesis Blocks Genesis Custom Blocks

How do I remove the gap between my header and custom menu?

Welcome!

These forums are for general discussion on WordPress and Genesis. Official support for StudioPress themes is offered exclusively at My StudioPress. Responses in this forum are not guaranteed. Please note that this forum will require a new username, separate from the one used for My.StudioPress.

Log In
Register Lost Password

Community Forums › Forums › Archived Forums › Design Tips and Tricks › How do I remove the gap between my header and custom menu?

This topic is: not resolved

Tagged: Agency, gap, header

  • This topic has 8 replies, 2 voices, and was last updated 10 years, 2 months ago by Sunil.
Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • January 12, 2013 at 1:17 am #11413
    Sunil
    Member

    Hi,

    I'm using the agency theme. My site is http://adultacnetreatmentreviews.com.

    If you see that there is a gap between my header image and my custom menu.

    How do I remove this gap?

    Thank You.

    Regards,

    Sunil

    January 12, 2013 at 10:56 am #11459
    Jon Bellah
    Member

    So the simple fix to do what you're looking for is:

    #header {
    display:none;
    }
    
    

    But I wanted to point out that there's a much better way to implement a header than the way that you did. You're using the <center> tag and calling your own header image, presumably with a genesis_before_header hook. But, Genesis comes with really nice, semantic structure built in. So the better way to implement your header would add this to the bottom of the "Image Header - Full Width" section of style.css.

    .header-full-width #title {
    background:url(images/header.jpg) no-repeat;
    }
    
    

    Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com

    January 12, 2013 at 11:18 am #11463
    Sunil
    Member

    Hi Jon,

    Thanks for your response. Ok. Before I implement what you highlighted, where exactly in the style.css file, do I place the following code?

    #header {
    display:none;
    }

    Because when I open the style.css file, I see many header option codes there. Also where do I place these following codes too?

    .header-full-width #title {
    background:url(images/header.jpg) no-repeat;
    }

    In this case, the [header.jpg] is to be replaced by my original image name right?

    I just switched from eleven40 theme today to the agency theme. It was difficult to customize the header for that theme. But I liked the footer of that theme. I had a nightmare when I tried to edit the php file. All I did was added an extra } code and the whole thing went blank! But thankfully Brad Dalton from the helpdesk helped resolved my problem.

    January 12, 2013 at 11:19 am #11464
    Sunil
    Member

    Sorry, something went wrong with my message. The codes not displaying well here.

    January 12, 2013 at 11:21 am #11465
    Jon Bellah
    Member

    Place the #header code just before the line that reads:

    /* Navigation Constants
    ------------------------------------------------------------ */
    

    Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com

    January 12, 2013 at 11:31 am #11466
    Sunil
    Member

    Hey Jon! I managed to remove the gap! Thanks! You seem to be well-versed in css!

    So for the 2nd code you showed me, before placing it in the style sheet, do I have to remove the codes I placed in the genesis header hook first?

    January 12, 2013 at 12:30 pm #11476
    Jon Bellah
    Member

    Yes, you should remove that when you place the other code in your stylesheet. Hope that helps!


    Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com

    January 12, 2013 at 12:41 pm #11480
    Sunil
    Member

    Hi Jon,

    Sorry. I did not work. The banner did not appear. So I'm recalling the banner through the genesis hook method again. 🙁

    January 12, 2013 at 12:44 pm #11481
    Sunil
    Member

    *It did not work.

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • The forum ‘Design Tips and Tricks’ is closed to new topics and replies.

CTA

Ready to get started? Create a site or shop for themes.

Create a site with WP EngineShop for Themes

Footer

StudioPress

© 2023 WPEngine, Inc.

Products
  • Create a Site with WP Engine
  • Shop for Themes
  • Theme Features
  • Get Started
  • Showcase
Company
  • Brand Assets
  • Terms of Service
  • Accptable Usse Policy
  • Privacy Policy
  • Refund Policy
  • Contact Us
Community
  • Find Developers
  • Forums
  • Facebook Group
  • #GenesisWP
  • Showcase
Resources
  • StudioPress Blog
  • Help & Documentation
  • FAQs
  • Code Snippets
  • Affiliates
Connect
  • StudioPress Live
  • StudioPress FM
  • Facebook
  • Twitter
  • Dribbble