Why is it so broken when decreasing?

Question

css

How to make it so that when the image is reduced (from 860px to 100px in this case), it will not be so battered?

Answer 1

Solution: for images, set image-rendering: unset;

Answer 2

You set the height and width clearly, so the image is distorted. Make for miniature

height: 60px;
width: auto;

and the artifacts must go