Having just started diving into Flexbox this course couldn’t have come at a better time. It’s an interesting take on learning and should help reinforce memorizing all the different types of Flex options that are available.
The course is free with three chapters available, with the goal of having twelve available in the future. It’s free to start the course but it does require registration.
Set the .in as a display flex, and it has to be defined as “!important” because Bootstrap itself puts a style="display: block" in the DOM once it’s opened. Then in the .modal-dialog set the margin to auto, so it’s centered on the screen, both vertically and horizontally.
Thanks to Flexbox creating a vertically centered Bootstrap modal window is now easier than ever.