Full Screen Slider - Odd margin/padding issue in Firefox

Hi aThemes,

I’ve recently noticed an issue which only seems to occur in Firefox (desktop) when viewing a website built using the Sydney theme. I’m not sure if this issue is replicated across all OS’s but it shows up in MacOS and only in Firefox; I’ve tested in both Chrome and Safari and there is no such issue.

The problem relates to some phantom margin/padding which appears when scrolling down a page which features a full screen slider image.

This is how it should render:

When the page is scrolled:
Screen Capture 002

Note in the second image how much white space appears between the bottom of the full screen slider image and the content in the following section.

I’ve checked over the code and can’t see anything untoward (furthermore, I would have assumed the problem would be replicated across all browsers if it was a coding/layout error)?

Website URL: Legge House

Any help or ideas would be very much appreciated!

Keep up the great work. :o)

Gaz

Hello there,

We experienced some server issues. Have you received my reply in your inbox?

Regards,
Kharis

Hi Kharis,

Thanks for the response.

Unfortunately not - no reply received.

Could you re-send or reply here?

Many thanks,

Gaz

Have you checked your spam folder?

Hi Kharis,

Thank you for the reply and apologies for the slight delay in my responding to you.

Yes, I have checked the Spam/Junk folder of the email address I used to register with yourselves - nothing has appeared. :o(

I’ll await your further suggestion(s).

Cheers,

Gaz

Hello there,

Please try using 1280px x 720px wide image. If you consider to use larger one, ensure you maintain the same aspect ratio. To help you get it, use this tool https://calculateaspectratio.com

Regards,
Kharis

Hi Kharis,

I shall give that a try and report back. :o)

Many thanks!

Gaz

Hi Kharis,

Ok, I’ve tried your suggeston of using an image = 1280px x 720px and also a larger image (2000px x1125px, using the same aspect ratio as confirmed in Photoshop and the tool you mentioned above); the latter, larger image, is currently on the website. I also cleared both site and browser cache and optimised the DB before re-loading in the browser.

The problem still persists, unfortunately. :confounded:

The strange thing is, when I open the developer tools console in Firefox the problem vanishes?! Then, when I close the dev tools console the problem is back. Absolutely no idea why. :joy:

As mentioned in my original query, this only seems to affect Firefox.

Any other ideas?

Thanks in advance.

Gaz

Still getting this issue over a year a later. Any updates?