Gap on homepage

Hi there,

I have a gap between my header and my first row, as well as the last row and my footer, on my homepage. This only appeared recently while I was editing something on the homepage that should have been unrelated to this. In the gap, you can see the background image that is set for the rest of the site but should not be visible on the homepage, and never has been before today.

You can see what I mean on the site below:

http://www.luciterradance.com

Any help to get rid of this gap between rows would be greatly appreciated!

Hello there,

Thank you for letting us know about it. And I would like to apologize in advance for inconvenience.

To fix the issue, could you please try to apply the following CSS code through the Simple Custom CSS plugin or child theme’s style.css?

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

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

.page .entry-footer{
  display: none;
}

.page .content-area .hentry{
  padding-bottom: 0;
}

Let me know how it goes. I’ll wait to hear back from you regarding your stats.

Regards,
Kharis

Hi there

I copied the above code into the simple css plugin and it doesn’t seem to have addressed the issue.

Thank you for your help!

Hello there,

Thank you for updating me.

Could you please try clear your browser’s cache before reloading your site? If you have cache plugin like “W3 Total Cache”, try to clear all cache as well.

If it none of them gives any changes, please try to change the CSS code I previously suggested with the following:

.page-wrap{
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.page .page-wrap .content-wrapper, 
.single .page-wrap .content-wrapper {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
} 

.page .entry-footer{
  display: none !important;
}

.page .content-area .hentry{
  padding-bottom: 0 !important;
}

Let me know how it goes.

Regards,
Kharis

Hi there,

Thank you! The homepage looks great now, no gap. I appreciate your help. I have noticed now, though (not sure if these two things are related), that on all my other pages, there is no padding between the navigation bar at the top, and the content of the page. This didn’t used to look like this. Here is a page to look at so you can see what I mean:
http://luciterradance.com/index.php/performance-2/

Any help you can offer there would be great!

Cheers

Hello there,

Thank you for reporting.

What will happen if you replace the CSS code I previously suggested to with the following?

.home .page-wrap{
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.home.page .page-wrap .content-wrapper, 
.single .page-wrap .content-wrapper {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
} 

.home.page .entry-footer{
  display: none !important;
}

.home.page .content-area .hentry{
  padding-bottom: 0 !important;
}

Let me know how it goes. I’ll wait to hear back from you regarding your stats.

Regards,
Kharis

Hi!
That seems to have mostly done the trick, although the logo at the top left is still slightly overlapping the Call To Action buttons at the top of the pages.
http://luciterradance.com/index.php/instruction/

Is it possible to get a little more space there? Thank you!

Hello there,

Try to apply the following CSS code:

@media only screen and (min-width: 992px){
  #content{
    margin-top: 70px;
  }  
}

Let me know how it goes.

Regards,
Kharis