title: How do I center an img within a div without the img shrinking?
body: <blockquote>
  <p>I used <code>display: flex</code> and <code>justify-content: center</code> to center the img within the div, it did in fact center the img but it shrank the img to a very small size. How do I center the img without having it shrink? I included a picture of this. I also tried re-sizing it with <code>.img-star img { width: 3em; }</code>, but it doesn't work. Pls help thanks.</p>
  </blockquote>
  <p><a href="https://i.stack.imgur.com/rnRF8.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/rnRF8.png" alt="enter image description here" /></a></p>
  <pre><code>.img-star {
    border: 1px solid white;
    padding: 20px;
    margin: 30px;
    border-radius: 50%;
    width: 45px;
    height: 45px;
    display: flex;
    justify-content: center;
  }
  </code></pre>