Circular one-shot button flex container Perspective


I’m trying to get a circular one-shot button in the centre of a flex container in perspective, I made the one-shot button round by setting the border radius to 100% so it now is supposed to be round but it does not look like a circle at all.

when I give the button a padding of 120px it is circular but I don’t think that is the proper way to make it circular.

I hope someone can help me out.

Setting the borderRadius to 100% will indeed make a smooth transition from one “side” to another, resulting in the appearance of a circle, but this will only work if the sides are all equal length.

Remove the padding property you inserted, and modify OneShotButton.position.width and height so that they are equal. This should result in a circular One Shot Button.