how fade in a flex box?

Question

How do I get a flex box to not be part of the page until I fade it in? I used to do this with \'display: 0;\' and then use jquery .fadeIn(). But now if I set display to 0, when

Answer 1

Easiest and most clean way (if you can edit DOM) is to wrap the element, and fade the wrapper while having div with flex inside

css:

.popup {
  display: none;
}

.popup__flexbox {
  display: flex;
}

js:

$("#popupContainer").fadeIn();