How to create circle image in pug file/css

user_10756482 0
Viewed 364

I am trying to make a circle image but it keeps showing as an oval. The only way I got it to work as a circle was by using this css code:

.teamImage {
 border-radius: 50px;
 width: 50px;
 height: 50px;}

However that shows up way too small and also it is not centered. Example here: enter image description here

Using this css code I get a big elliptical shape:

.teamImage {
 border-radius: 50%;
   }

enter image description here

I want it to look like the second image, length/height wise but be in the shape of a perfect circle.

This is from the .pug file:

    .columns
      .column.is-one-third
        .card
          img(src='../images/team1.jpg', class="teamImage")
          .h3.is-3.title Jane Doe
          .p.title CEO & Founder
          .p Some example Text
          .button Contact
pug css html
1 Answers
user_7510190
Related