Use CSS to to remove padding/space between page Title/Menu and first element

[BARTLEIGH]

I would like to remove much of the extra space on all pages, between the header/menu and the image element right below it; and I am using the Hugo-CleanLines 2 Theme:  https://www.jonericschafer.com/

I've chosed No header for all my pages, which helps marginally, but a too large space still exists. I've also spent time looking at all the CSS in main.less and header.less and elsewhere and anything else in the CSS style sheets that remotely looks like it's relevant for reducing padding and made changes, but to no avail.  I have used Firefox's development tool (inspector - style editor) and can't seem to find the relevant CSS code that would accomplish this.

Also, thinking there is no existing CSS code, I've tried addingh some new CSS as suggested in some of the other posts in the community.  Here's a link to the site I'm working on for an artist friend.  It's designed to be minimal with the major focus on the art, so I would like to remove, or at least cut in half,  the existing space between the large image elements (including the slideshow page) for all the pages.

https://www.jonericschafer.com/

Any ideas would be appreciated.

[BARTLEIGH]

I would like to remove much of the extra space on all pages, between the header/menu and the image element right below it; and I am using the Hugo-CleanLines 2 Theme:  https://www.jonericschafer.com/

I've chosed No header for all my pages, which helps marginally, but a too large space still exists. I've also spent time looking at all the CSS in main.less and header.less and elsewhere and anything else in the CSS style sheets that remotely looks like it's relevant for reducing padding and made changes, but to no avail.  I have used Firefox's development tool (inspector - style editor) and can't seem to find the relevant CSS code that would accomplish this.

Also, thinking there is no existing CSS code, I've tried addingh some new CSS as suggested in some of the other posts in the community.  Here's a link to the site I'm working on for an artist friend.  It's designed to be minimal with the major focus on the art, so I would like to remove, or at least cut in half,  the existing space between the large image elements (including the slideshow page) for all the pages.

https://www.jonericschafer.com/

Any ideas would be appreciated.

[Bernadette3]

I know it's possible to do, but I unfortunately wouldn't know where to guide you. Although, if anyone else in community has any suggestion the theme is Clean Lines.

[BARTLEIGH]

Thanks Bernadette.

Yes it must be possible, but I'm not quite skilled enough to find the exact syntax or the labeling of the HTML element used for the CSS to manipulate or add.  It's kind of like trial and error; and after looking at all the CSS available in the Weebly editor, but mostly main.less and navigation.less I'm ready to give up.  It's frustrating.   I hope someone in the community knowledgable about CSS might have some tips on how to manipulate that space.  I first suspected it would be done by removing padding, so looked for elements that had padding. 

[Adam7 · Accepted solution]

Something like this in Settings > SEO > Header Code would remove the margin on the live site:

<style>
	.site-navigation
	{
		margin-bottom:0px !important;
	}
</style>

[BARTLEIGH]

Many thanks Adam. That worked perfectly.

--Bart

[Adam7]

Awesome! Glad to hear that.

[Hub1]

I am having same difficulty with space between header and first element of text. I cannot seem to locate the correct line of CSS code.

[Adam7]

What site are you having trouble with, @Hub?

[jeremyleediaz]

Also having a similar problem with my site, thethreadand.co with the navigation bar having a medium dark gray space under it. It doesn't seem to belong to top element or header on any page... it's just there... Any suggestions?

[Adam7]

It looks like that grey stripe is being added by a Powr app you have added to the site. Try removing/disconnecting that app to see if it helps.

[sweetpickle05]

I am also having difficulty removing much of the space between the header and the body. I'm using Birdseye 2 on www.thetrumantribune.com. I've tried a few things (including the code posted above), but I wasn't exactly sure where to use that code. When I tried it placing it a few places, I didn't get any change. I am also a complete newb at this.

<style>
	.site-navigation
	{
		margin-bottom:0px !important;
	}
</style>

 Thanks!
~Nikki

[FiddlePetra]

 I am having the same problem:

I like to  remove padding/space between my header and first element - it is a photo sub title

I am using Unite 2 - Personal.

I do not know where to put the code you gave us. I tried different places, but it did not work:

Here my site: https://www.boisebaroque.org/mission--history.html

Please help

Petra

[BJ5]

Most code like that would go in Settings > SEO > Header Code if you want it on all pages of the site, otherwise put it in the Header Code field in the SEO Settings for a particular page on the pages tab.

[Highestwater]

Hi Adam.

I'm afraid that this code makes no difference.

I have just migrated my site to the Dusk 2 Theme and now all the text elements, images and many others have an extra blank line at the bottom.

When I want to pad with white space I will add a Spacer. So please can you explain how to remove this blank line from every element on my site.

Thank you

Steve

[Mr_Nick_White]

Website: https://nickwhitefilm.weebly.com/director.html

I'm trying to figure out how to remove a lot of the unnecessary spacing on my site, and these two sections in these images have been giving me the most trouble: https://imgur.com/a/C2yXwJ2

Is there any way that I can make these gaps smaller? Alternatively, for the second example, is there any way I can put a caption on top of a photo with tighter spacing instead of having to place a text box above it?

Any help is appreciated.

[Bernadette3]

Thanks for reaching out, Nick. I've moved your post over to a thread that may help you out.

[Mr_Nick_White]

I have tried everything listed in this thread and none of it has helped.