title: Bootstrap's img-circle css class resizes my image to a different ratio
body: <p>I want to take an image (it should work for a square or a rectangle) and make it into a circle of a fixed size. Right now, I use Bootstrap's img-circle class and my own css. Here is my own CSS:</p>
  
  <pre><code>.circle-img {
    min-width: 250px;
    min-height: 250px;
    max-width: 250px;
    max-height: 250px;
  }
  </code></pre>
  
  <p>However, it is taking a rectangle image and squeezing it, messing up the ratio.</p>