title: Give circular background to image without cropping
body: <p>I want to give a circular background to white image. My code looks like this:</p>
  <pre><code>.cs-ways img {
      display: block;
      background: #2B80C5;
      padding: 10px;
      width: 50px !important;
      border-radius: 50em;
      height: 50px !important;
      object-fit: initial;
      margin: 10px;
  }
  </code></pre>
  <p>This gives the following result:
  <a href="https://i.stack.imgur.com/H3lKb.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/H3lKb.png" alt="enter image description here" /></a></p>
  <p>As you can see the white image is being cropped in a circular fashion. This not something I want, how to fix this? I must use an image lement</p>