How to set width to 100%

[eivanmariscal]

Hello, I'm trying to set the slider width to 100% but something strange happens when positioning on the last slide/tab, it shows a fragment of the first tab and the current tab moves to the left side. When positioning on the other tabs the content looks fine.

When I resize the window on Chrome the problem fixes itself but on Firefox it fixes for a couple of seconds and then it moves again.

This is the CSS I changed:
.liquid-slider .ls-panel {
width: 100%;
display: block;
float: left;
}

How can I set the slider to 100%?

[KevinBatdorf]

One possible solution:

Try setting the .ls-panel and .liquid-slider classes to both a fixed max-width like 2000px. I know it's not very semantic but I wrote this code 4 years ago and had to make it easily upgradable with the Coda Slider that came before it

If that doesnt work, I have another idea what might be causing it. Let me know

[eivanmariscal]

Thank you for replying, Kevin.
I tried setting the max-width to 2000px but it didn't fix the problem. However, I tried with values like 1000, 1400px and the problem was partially solved. On screen resolutions like 1080p the slider works perfectly because I set the max-width to 1400px but on resolutions below 1080p the problem keeps happening.
Do you think there's another alternative to fix the problem?
Thanks in advance!

[KevinBatdorf]

It could be specific to your code. Send me an email [email protected] with your code and I'll post the solution here.

[cacacobra]

I solved this doing some dirty fix. See code below, taken from "jquery.liquid-slider.min.js"

.css({"max-width":jQuery(i.sliderId+" .ls-panel:first-child").width(),width:"100%"})

Just change "max-width" to "mmax-width" or some inválid CSS code, it worked for me.

[KevinBatdorf]

Hey @cacacobra

This thread 2.5 years old :D I haven't worked on this code in a long time so it's not fresh in my memory. I'm not sure the above hack is needed, but if it works then good. Resize the browser a few times to make sure nothing breaks.