➡️ 이미지나 비디오가 박스크기에 들어가면서도 가로세로비를 유지하여 찌그러지며 왜곡되는 현상을 방지하기 위해 height: auto; / object-fit: contain; / object-fit: cover; 을 사용한다. 1. 기능 콘텐츠의 가로세로비 유지 2. 방법 1️⃣ height: auto; 2️⃣ object-fit: contain; 3️⃣ object-fit: cover; 이미지나 비디오를 화면에 그리다보면 원본사진의 사이즈와 콘텐츠가 들어가야하는 박스사이즈가 달라서 찌그러지는 왜곡현상이 발생할 때가 있다. 예를 들면 아래와 같은 상황인데 짱구가 위아래로 조금 찌그러져있는 것을 확인할 수 있다. 인위적으로 찌그러지는 상황을 만들기 위해서 아래의 img에 width: 700px; heigh..