Remove white space between header and page content

#1

I want to remove the white space between the header and where my page content starts on my site deskspacesolutions.com

I did look for solutions and the two I saw


Neither resolved this issue

I am using Eliminator plugin for page building and did try to adjust Margin Top to 0 but that did not work

I also tried the solution mentioned at Remove space between header image and posts on category page

I set both top and bottom margins to 0, and while it reduced the white space it still left some showing

Thank you

#2

Hello there,

Try adding this CSS code to Appearance > Customize > Additional CSS from dashboard.

    .page .page-wrap .content-wrapper {
      padding-top: 0;
      padding-bottom: 0;
    }

Regards,
Kharis

#3

Awesome that did it!

Thank you

#4

You’re welcome!

Please let us know in a new topic if you have any further questions, or if we can provide you with any other assistance.

Regards,
Kharis

#5

Hello,

I am having the same issue on my mobile site. There is a large white space between the header and content. I have attempted several different custom CSS found on the forum here, and none seem to be working. Can you please take a look and help me find a way to remove this?

Thank you!

#6

Hello there,

I didn’t get this issue appearing on your site’s homepage. Does it only appear on specific pages? Would you please provide us links to those pages?

Regards,
Kharis

#7

Hi Kharis,

The problem is only on mobile, and on all pages besides our main home page. I have included the link to some of the pages below. Again, this problem only exists on mobile. Thank you!


#8

Hello there,

I am sorry I couldn’t get where the issue actually appears on. Is it possible to take a screenshot and put some necessary annotations, and share it here?

Regards,
Kharis
aThemes Support

#9

Hi Kharis, I have included a picture below of what the pages look like on my phone. Our menu has three pages besides the home page, all of these pages have the white space you see in the image below on mobile.

image0
image0.png295×640 115 KB

#10

Hello there,

From your site’s dashboard, go to Appearance > Customize > Header area > Header Media; ensure you don’t have empty image in there. You might need to repload your header image.

Regards,
Kharis
aThemes Support

#11

Hi Kharis,

I removed the header image from the Header Area and this did indeed fix the problem on mobile. However, the desktop site is now showing up wrong. The content is appearing behind the menu on the tope of the page. Is there a way to make the content low enough to appear correctly on desktop, but also appear without a large empty space on mobile?

Please see below picture of the content covered by the menu on desktop.

37%20PM
Screen Shot 2020-01-10 at 2.19.37 PM.png1259×516 91.9 KB

#12

Hello there,

Probably you enabled incorrect header type for you don’t use header image. Visit Appearance > Customize > Header area > Header type; and enable “No header (only menu)”.

Regards,
Kharis
aThemes Support

#13

Hi Kharis,

This worked! Thank you so much for your help!!

#14

Great!

You’re welcome! Please let us know in a new topic if you have any further questions, or if we can provide you with any other assistance.

Regards,
Kharis
aThemes Support