Gap showing between header and top of slider

Sparkling
1

Hi again,
I’m still using my local test server to test out my site and I have two issues I’m seeing.

  1. I’m currently getting a gap between the header and the top of the slider on the home page. I don’t get the gap in the live preview screen. I had to make the header a bit larger to accommodate my logo.

  2. The menu is closer to the top of the header but because the header is now wider, it looks a bit odd. I’d like to center it by moving it just a bit down and align it with the logo. Is there a way to do this?

I’ve attached a screenshot.

Thanks in advance!

2

Hi @clauds,

I hope you are well today and thank you for your questions.

1. I’m currently getting a gap between the header and the top of the slider on the home page. I don’t get the gap in the live preview screen.

The gap is not appearing on my test site so i can’t remove it from your site until i access your site.

I had to make the header a bit larger to accommodate my logo.

You can try achieving this by adding the following CSS code in the Custom CSS option of the latest version of Sparkling theme on the below path.

Admin Area -> Appearance -> Customize -> Sparkling Options -> Other -> Custom CSS


div#logo {
    height: 110px;
}

Please change the height value 110px in the above code to whatever you want to set.

2. The menu is closer to the top of the header but because the header is now wider, it looks a bit odd. I’d like to center it by moving it just a bit down and align it with the logo. Is there a way to do this?

You can try achieving this by using the below CSS code and adjusting the value 10px in it.

.nav.navbar-nav {
    margin-top: 10px;
}

Best Regards,
Movin

3

I’m so sorry Movin! I did not get an alert for your reply so I just saw this. Thanks for the responses. I tried both and the second for the menu placement works great.
The first solution only increased the size of the header but the gap between header and slider is still there. Is there anything else I can try?
Thanks again!

4
The first solution only increased the size of the header but the gap between header and slider is still there. Is there anything else I can try?

As said previous the gap is not appearing on my test site so i can’t remove it from your site until i access your site.

5

Ok, thanks. I’ll revisit this issue once I move to a live site and see if I have the gap there as well. It will be at least a couple of months.

Regards,
Clauds

6

You are always welcome here :slight_smile: