Default setting for slider isn't aligned left
See original GitHub issueOn previous version (0.16.0
), I could have the Slider
to align left, but starting from 0.17.1
, it doesn’t have the same behavior.
Picture taken from: http://neostack.com/opensource/react-slick
On my project:
v 0.17.1
:
v 0.16.0
:
Both use the same settings:
const sliderSettings = {
autoplay: false,
autoplaySpeed: 5000,
pauseOnFocus: true,
pauseOnHover: true,
dots: false,
arrows: false,
infinite: false,
speed: 500,
slidesToScroll: 1,
draggable: true,
swipeToSlide: true,
variableWidth: true,
};
It’s as if the Slider is forcing the component to align RIGHT instead of the usual LEFT in previous version of react-slick
. Is this intended or a bug?
Issue Analytics
- State:
- Created 6 years ago
- Comments:42 (4 by maintainers)
Top Results From Across the Web
R8: Aligning The Fullwidth Slider Text Left or Right | Divi Soup
For left alignment use ds-slider-left, for right alignment use ds-slider-right. If you want center alignment then that is the default setting so ...
Read more >Smart Slider - Slide Editing - Alignment & Spacing - YouTube
Creating a great looking slider often needs you to align your layers to the left or right side of the slide, or even...
Read more >How to make alignment on the left side in the slick slider?
Just set your margin to left 0 in .slick-track : .
Read more >How to align slider labels in SwiftUI - Apple Developer
What you need to do is to create a new custom alignment value, and tell your VStack to align its content using that....
Read more >Revolution Slider Alignment Off-center | Themeco Community
However, the Revolution Slider is not centralise and if i adjust the width, it will extend to the right while leaving a gap...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
.slick-list> div {
margin-left:0; }
This worked for me
The problem is related to
transform
on theslick-track
. If you turn off that CSS property, it looks correct.