🔗 수평 / 수직 정렬(align)text-align : 2행 이상부터 사용 가능vertical-align : inline, inline-block, table 요소에서만 사용 가능margin/padding : 편한 방법이지만 정확하게 맞추기 힘듬line-height : 부모와 자신의 높이 조절position : margin/padding과 동일하게 정확하게 맞추기 힘듬griboxflexbox의 정렬 속성(justify-content, align-items, etc...) : 가장 사용하기 좋음📘 가운데 정렬 예시 1.box1 { border: 2px solid tomato; height: 100px;}.box2 { border: 2px solid teal; text-align:..

🔗 overflow 속성콘텐츠 초과 처리/* default, 콘텐츠 크기 부모 요소보다 커지면 잘리지 않고 넘침 */overflow: visible;/* 초과된 콘텐츠는 안보이게 처리함 */overflow: hidden;/* 스크롤 바를 내려 초과된 콘텐츠를 볼 수 있도록 함 */overflow: scroll;/* 자동으로 넘치는 경우 스크롤 바를 만들어줌 */overflow: auto;🔗 object-fit 속성img 태그 이미지 배치/* default, 콘텐츠(이미지)가 컨테이너(img 태그)를 채운다 */object-fit: fill;/* 본래의 이미지 크기를 유지 */object-fit: none;/* 상하/좌우 중 먼저 이미지가 컨테이너에 맞닿을 때 크기로 맞춰줌 */object-fit: c..