Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Slider component transforms out of the screen, and items takes the wrong direction #2119

Open
h1sashin opened this issue Jan 11, 2022 · 2 comments

Comments

@h1sashin
Copy link

Transform

I just copied React-slick config etc. from other project (I have never used It) and I adapted it to my project. But after running my app I couldn't scroll whole page, I was scrolling only Slider component. I thought it's because of my components height, but not, height was set to 200px. then I set something up and now I can scroll bla bla bla. Slider just decided to make itself transform left to fill WHOLE screen, but out of the screen, but so as not to travel past the component it's wrapper with to its right. That's my first problem. Arrows are in right place.

Setting wrapper width to 100% doesn't help.

react-slick transform

Direction

After I manually changed Slider to not transform, left too much, I saw all components are set in the column, including arrows.

react-slick direction

Is it problem with my code anywhere or I just can't setup the slick? I couldnt find anything like this in my css

* {
    *css here*
}
@SofianeBoumedine
Copy link

I encouter the same issues you need to add the style of slick-carousel.
You can do it with the cdn in your index.html : <link rel="stylesheet" type="text/css" charset="UTF-8" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick.min.css" /> <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick-theme.min.css" />

or directly in the main component : think to install slick-carousel before import this : import "slick-carousel/slick/slick.css"; import "slick-carousel/slick/slick-theme.css";

@sjonchhe
Copy link

got the same issue, has anyone found any solution to this?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants