I am working on a design that I had to center some images. I have tried UI Slider and Slick Slider to get it working, but they always break in Material CSS Modal.
Here is the screenshot of what I am trying to achieve.
I tried to use this CSS
//HTML
<div class="scroolable">
<img src="/assets/card4.png" alt="">
<img src="/assets/card4.png" alt="">
<img src="/assets/card4.png" alt="">
<img src="/assets/card4.png" alt="">
<img src="/assets/card4.png" alt="">
</div>
//css
.scroolable {
display: flex;
justify-content: center;
overflow: scroll;
}
justify-content: center; doesn't seems to work
您需要在此处使用align-items
( https://developer.mozilla.org/fr/docs/Web/CSS/align-items ) 而不是justify-content
。
As Jeyffrey has stated above align-items
is the thing you're looking for. You might want to take a look at https://css-tricks.com/snippets/css/a-guide-to-flexbox/ as it might be helpful.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.