[CSS] ul, li 가운데 정렬

보통 가운데 정렬 할때 margin:0 auto; 많으들 쓰시죠. 하지만 이건 가로크기를 고정으로 해야한다는 단점이 있습니다.

유동적으로 하고 싶을 때의 방법은

text-align: center;와 display: inline-block; 을 이용하는 것입니다.

<img/> 텍스트가 아닌데 text-align 하면 먹히는건 경험 해보셨나요??

이 <img> 태그가 text-align 속성이 먹히는 이유는 이게 inline-block 속성을 가진 태그 이기 때문입니다.

즉 text-align 은 텍스트와 inline-block 속성을 가진 태그들을 정렬 해줍니다.

ul을감싸는wrap { text-align: center }

ul { display: inline-block; }

끝~

즐코딩하세요~~

도움이 되셨다면 아래 공감 버튼을 꾸욱~

▼▼▼▼▼▼