尝试制作圆形图像

Question

This question has been asked many times before but I still can't seem to figure such a simple problem out.

I'm trying to take an image and make it into a circle but when I try to do this:

const styles = {
  profileImage: {
    padding: "5% 0",
    objectFit: "cover",
    display: "block",
    width: "10vh",
    height: "10vh",
    borderRadius: "50%",
    border: "1px solid white", 
    margin: "0 auto"
  }
}

My image still comes out looking like this:

The white border is what I'd like the dimensions to be but the actual photo gets cropped off for some reason. I would appreciate any pointers! Been pulling my hair out for this :-(

Thanks!

Answer 1

I think it is due to this line:

padding: "5% 0",

Try removing that line