Space between header and first row on homepage

Shapely
#1

Hi There

(sorry about all these requests - I’m in a panic, trying to recreate a site in a day, that i made in a few weeks, after Hosting Company broke the original site).

I have a space between the first row and header on the home page of the following site. I’d like to remove this.

Site - https://stoptheworldcafe.live-website.com

Please see screenshot

Thank you

#2

Good morning

is this already fixed? Please see a screenshot from me, there is no such line,

#3

Hi there

This is still not fixed . . . see - http://stoptheworldcafe.com/

There is some additional CSS in the site (at work at mo, I can’t get into the back end). But this isn’t working.

Any help would be very valuable.

Many thanks!

#4

Good evenin

try this css:

.main-container {
position: relative;
top: -30px;
}

Don’t know how but you are adding 30px somewhere in the template, code will fix it, if this only happens on homepage use .home seletor:

.home .main-container {
position: relative;
top: -30px;
}

#5

Thanks for taking a look.

Yes I know what you mean. I can’t see where that extra 30px is coming from. Can you see? It’s happening on all pages.

I tried your fix, the one for all pages. It works on desktop but not mobile.

Cheers

#6

I used the ‘inspect’ menu item in Chrome. The space seems to be down to . . .

.mt20 {
margin-top: 20px !important;
}

If i reduce margin-top to 0px, the problem disappears. However i’m not sure where this is defined in the site.

#7

Good morning

mt20 is default class defined in the theme, you can use your code if the problem is solved

#8

Hi

I have no code. I was making the change within the ‘inspect’ feature in Chrome (where you can make temporary changes.

I still need help fixing this with a fix that works on mobile and desktop please.

Thanks.

#9

Good evening

Try this code:

.main-container > .header-callout {
display: none;
}

#10

Thanks for taking a look.

That works, on desktop and mobile, when I use it with the following . . .

/Removing extra space between nav ribbon and hero/
section.content-area.pt0 {
padding-top: 0px;
}

Thanks!

#11

Good morning

So, is everything now looking good? :slight_smile: