This is true on desktop and mobile (slightly different versions of the slider one each). I went into my backend to zero-out the margin and padding on the containers around the slider and still can't get it to go away, so I think it has to do with the slider itself. Canvas height is set to 620px, responsive. Any ideas?
Thank you for getting in touch with us. My name is Attila and I'm happy to assist you today. I appreciate your patience while we've been working towards your ticket.
I've tried to access the URL you provided, but it does not seem to be available. I get the following error: site unavailable staging.thelandinggroup.com ERR_NAME_NOT_RESOLVED
Where exactly can we check on the slider in question?
The problem is that the image you are using as the background, does not fill the slider. Since they have different aspect ratios/sizes there are blank spaces. You will need to fill the slider with that image to solve this.
To set a layer to fill out the whole slider, you can simply enter 100% to the layer's Width and Height fields in Styles tab. This way it will always match the slider's canvas, leaving no empty space.
Or alternatively you can add it as a slide background image and select cover or stretch mode for it. The result will be the same.
Both sizes matter not just the height, as the responsive behavior is not based only on one dimension. Their aspect ratio is way different. One of them is 1200*620 and the other is 1950*620. You can see why they won't fit each other properly. You can remedy this the mentioned ways, or by matching their aspect ratio.
Hello,
I have a lot of white space above and below my slider on my home page: http://www.thelandinggroup.com/
This is true on desktop and mobile (slightly different versions of the slider one each). I went into my backend to zero-out the margin and padding on the containers around the slider and still can't get it to go away, so I think it has to do with the slider itself. Canvas height is set to 620px, responsive. Any ideas?
Hello Benjamin,
Thank you for getting in touch with us. My name is Attila and I'm happy to assist you today. I appreciate your patience while we've been working towards your ticket.
I've tried to access the URL you provided, but it does not seem to be available. I get the following error: site unavailable staging.thelandinggroup.com ERR_NAME_NOT_RESOLVED
Where exactly can we check on the slider in question?
Updated URL:
thelandinggroup.com
Thank you.
The problem is that the image you are using as the background, does not fill the slider. Since they have different aspect ratios/sizes there are blank spaces. You will need to fill the slider with that image to solve this.
To set a layer to fill out the whole slider, you can simply enter 100% to the layer's Width and Height fields in Styles tab. This way it will always match the slider's canvas, leaving no empty space.
Or alternatively you can add it as a slide background image and select cover or stretch mode for it. The result will be the same.
That doesn't make sense. My canvas height is set to 620px, and so is the image.
Screenshot 1: https://www.evernote.com/l/AAUWy-xBiWFD748P7DnxFZu1z26TfoLmoVs
Screenshot 2: https://www.evernote.com/l/AAVBCCW0V_9BNKyCf8zA4Fb6svB_cAlYxbQ
Here's another - you can see the image covers the whole slide canvas:
https://www.evernote.com/l/AAWM_Rf9T75GZoaoR53sxQJiX48BFeQtrnw
Both sizes matter not just the height, as the responsive behavior is not based only on one dimension. Their aspect ratio is way different. One of them is 1200*620 and the other is 1950*620. You can see why they won't fit each other properly. You can remedy this the mentioned ways, or by matching their aspect ratio.
Got it! Changed the image to a background layer, enabled overflow, and used the "cover" option... finally got it working. Thanks!
Thank you for the feedback, glad you could solve the problem.
If you need further assistance please let us know.