CSS 글자 센터로 보내는 코드들

조회수 364회

align-items : center;

이거랑

text-align : center;

이거랑 둘이 어떤 차이가 있나요

  • (•́ ✖ •̀)
    알 수 없는 사용자

1 답변

  • text-align: center;는 단순히 "야! 이 엘리먼트가 담고 있는 텍스트를 이 엘리먼트 전체 너비 기준으로 중앙 정렬시켜"라는 명령입니다. 이 스타일 속성을 지정하는 요소가 인라인 블록이거나 최소한 블록일 것이라는 전제가 깔려 있으며, 그 요소 안의 인라인 요소들만을 가운데 정렬시킬 수 있고 무엇보다 Flexbox와 무관합니다.

    align-items는 Flexbox 스펙의 일종입니다. 저 스타일 속성을 지정할 요소와 중앙 정렬될 요소가 Flexbox의 구성 요소라는 전제가 깔려 있습니다. Flexbox가 무엇이냐? 하는 건 align-items를 궁금해하신 마당에는 스스로 공부하셔야 합니다. 공부가 끝나고 나면, 그래도 가끔 제한적인 목적에서는 text-align이 더 적절할 수 있다는 걸 이해하시게 될 겁니다.

답변을 하려면 로그인이 필요합니다.

프로그래머스 커뮤니티는 개발자들을 위한 Q&A 서비스입니다. 로그인해야 답변을 작성하실 수 있습니다.

(ಠ_ಠ)
(ಠ‿ಠ)