Height of sliders

[iamwithU]

Hello,
I started using 4 sliders for my Homepage. But I’m not that adept in sizing the sliders.

I manage to size the sliders to the height I want for the phone screen. But when it appears on the laptop screen, 2 of the sliders (which are half the height of the 1st slider on the phone screen i.e. the 2nd, 3rd slider) became same height of the 1st slider. Hence these 2 sliders now look bloated on the laptop screen. What am i doing wrong here?

[thai]

Hi There,

You can change the slider’s height for each screen size under Slider Settings:

I could see that you’ve set the height of mobile and laptop 1024px, so the height should be the same now. Please double check again.

Let us know how it goes!

[iamwithU]

Thanks Thai for quick response.
I like the laptop height for the 2nd slider to be half the height of the 1st slider. I tried reducing but there’s no effect.

[jade]

Hi there,

Please try setting the height of the slider lower than 500px to around 300px.

Hope this helps.

[iamwithU]

No it didn’t help - no change on the PC screen.

[ruenel]

Hello @iamwithU,

To create a fully responsive slider, I recommend that you check this out first:

Hope this helps. Please let us know how it goes.

[iamwithU]

No this doesn’t help. I’ve watched that video a hundred times & does not help in my situation.

[rad]

Hi @iamwithU,

In revolution slider and another responsive gallery, there is what we called aspect ratio and it’s not just related to the height you applied. With aspect ratio, the height changes as the width change. Example, let’s say your slider has 1036x768 pixel size and displayed on a 1200px screen, it will then scale to 1200x980 ( You can try this tool to https://andrew.hedges.name/experiments/aspect_ratio/) instead of 1200x768.

Now, the issue is, you’re trying to achieve a certain dimension by comparing two sliders given that their settings are different. First one is a full-screen (ignoring the aspect ratio), the others are full-width sliders. And these settings respond to sizes differently in comparison to each other, one ignores the height, one respect the aspect ratio.

It’s easier on mobile since the portrait is almost equal to two squares stacked together. But not on a landscape dimension. Try turning your mobile to landscape and view it, the sizes then changes and no longer half of the first one.

Try making them full-width sliders with dimensions relative to each other (like if first slider’s height is 1000px, then the next is 500px, again this will only work on full-width slider)

Thanks!