vue-agile
vue-agile copied to clipboard
Not possible to place agile in a flex
trafficstars
Describe the bug I would like to put the carousel in a
with display: flex;
The reason is that I want to vertically center the carousel on my screen
Code https://codepen.io/lukaszflorczak/pen/EJRNMM Just change the CSS of the app block to be display: flex;
To Reproduce Once the parent div is display: flex, then the carousel takes the whole width
Expected behavior Carousel works as with display: block parent div
Screenshots

Environment:
- OS: Windows
- Browser Chrome
It looks that width: 100% for .agile class fix the problem.
Branch issue-169 created!
You might need to add flex direction to make the dots show up below the slides.
.agile {
width: 100%;
flex-direction: column;
}