Header spacing

Hi,

So I’m having some issues with the website header displaying incorrectly on certain mainstream browsers (specifically, there’s some variance between Firefox, Chrome, Safari and IE). The header is covering up some of the content on certain browsers, and not on others.

Also of note, on firefox for instance, it initially displays correctly; however when you scroll down and then back up the content slides underneath the header and is then no different than the other browsers that also display incorrectly.

I’m aware that the content sliding under the header can be fixed with padding or margins; however, all this does is create unnecessary white space on the browsers that work without the margins/padding. It would be nice to have a solution that works across the board.

Any help would be much appreciated.

Website is www.tobygrayphotography.co.uk

Hey @tobygray,

Add the following custom CSS code in global CSS section

.x-section .x-container.marginless-columns { display: block; }
.x-section .x-container.marginless-columns .x-column { display: inherit; } 

Let me know how it goes.

Regards

Rahul, you are an absolute life saver. That’s worked perfectly.

Many thanks!

Thanks for the good words. It means a lot to us. :slight_smile: