Remove gap between Header and Nav Bar in Twenty Seventeen

• 

  critfall · Member · Feb 4, 2019 at 3:12 pm

  • Copy link
  • Add topic to favorites

  I’m having a problem similar to (3) in this post: https://en.forums.wordpress.com/topic/twenty-seventeen-header-image-position-in-pages-and-posts/

  On my posts and pages, there’s a gap between the header image and the navigation bar. I fixed this problem on my front page with this code:

  .navigation-top {
  border-top: none;
  }

  but the problem persists on posts and other pages.

  I’m a novice at CSS, so any help/explanation would be really appreciated. Thanks!

  The blog I need help with is: (visible only to logged in users)

• 

  phillipburger · Member · Feb 4, 2019 at 3:44 pm

  • Copy link

  Something like this should help:

  .wp-custom-header img { padding-bottom: 0px; }

  It looks like the actual image in the header has a 1px border on the bottom

  Let me know if that helps

• 

  mrsnlchauhan · Member · Feb 4, 2019 at 4:05 pm

  • Copy link

  Hi there,
  You might want to change a line of code in your twenty sixteen theme style file at line number 3362 to have following:

  {line-height: 1.6;}

  instead of what you have right now there ie; {line-height: 1.5;}

  Hope this helps.

  Best
  Sunil Chauhan

• 

  mrsnlchauhan · Member · Feb 4, 2019 at 4:11 pm

  • Copy link

  Hi,
  I just revisited the problem again and found another solution which might work better:

  Please change the line of code at line no 3289 in your style sheet to have following:

  .site-branding { padding: 0; }

  Hope this helps

  Best
  Sunil Chauhan

• 

  torres126 · Member · Feb 4, 2019 at 5:29 pm

  • Copy link

  @critfall Your website uses the self-hosted version of WordPress rather than WordPress.com, which is what this forum is designed to help with. Note the difference here: https://en.support.wordpress.com/com-vs-org/

  In future, it’s best to find help here: https://wordpress.org/support/theme/twentyseventeen/

  That being said, I just wanted to clarify @mrsnlchauhan’s suggestion to directly edit your theme’s CSS. I would recommend against this, because that CSS would then be removed every time you update the theme. Instead, it’s better to use the Customizer to insert CSS: https://codex.wordpress.org/CSS#Custom_CSS_in_WordPress

  Thanks! :)

• 

  critfall · Member · Feb 5, 2019 at 8:35 pm

  • Copy link

  @phillipburger: That didn’t seem to work. I double checked the header image, and I’m not seeing the border you mentioned.

  
  @mrsnlchauhan: Thank you, I will keep these solutions in mind.

  
  @torres126: Sorry about that! I didn’t realize I was on the wordpress.com forum. I’ll repost on the proper forum. Thank you!

• 

  mrsnlchauhan · Member · Feb 6, 2019 at 1:42 pm

  • Copy link

  @torres126 : Yes, you are right about that. Thanks for the suggestion and improving on my proposition. I just forgot to mention in a haste to answer that the stylesheet overrides must be done in child theme or via customizer so that they are intact even when the theme is updated.

  
  @critfall please take a note of suggestion posted by @torres126

  Thanks everyone.