Not possible to place agile in a flex

[philippeluickx]

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

[lukaszflorczak]

It looks that width: 100% for .agile class fix the problem.

[create-issue-branch[bot]]

Branch issue-169 created!

[philippeluickx]

You might need to add flex direction to make the dots show up below the slides.

.agile {
  width: 100%;
  flex-direction: column;
}