Why with max-width: 100%; blurry picture?

Question

React

https://codepen.io/freeman0204/pen/pWNBwy?editors=1100 especially the center one, max-width: 100%; makes the picture rubbery, if you remove it, the picture becomes clearer but not rubbery. How to make a picture rubber and that it would be clear?

Answer 1

https://codepen.io/bbrady/pen/ozrjKE
https://www.npmjs.com/package/react-circular-progr...

Answer 2

Your picture does not fit in the block and shrinks at max-width to the size of the block .. without this parameter, the picture becomes 100% and goes beyond the boundaries of the block.