CSS flexbox vertically/horizontally center image WITHOUT explicitely defining parent height

Question

With only the parent div and the child img elements as demonstrated below how do I vertically and horizontally center the

Answer 1

Without explicitly defining the height I determined I need to apply the flex value to the parent and grandparent div elements...

---

If you're using a single element (e.g. dead-centered text in a single flex element) use the following:

align-items: center;
display: flex;
justify-content: center;