[CSS] 텍스트 세로 중앙 정렬 4가지 좋은정보

>

박스내 텍스트를 세로 중앙으로 만드는 비결 상자 자체를 모드로 중앙에 나열하는 비결은 여기 게시물입니다.

텍스트 정렬 방식도 상자를 정렬하는 것과 크게 다르지 않다:> 편의상 분리를 해보았다.

※박스의 높이와 line-height를 같게 하면 문장의 상하 간격을 맞췄을 때 박스 높이에 같게 복판열로 된다.주의점:상자 잘 글이 2줄이 되면, 박스 아래에 친구가 나타난다. 텍스트가 한줄 한줄일때만 가능

포장할 상자를 table화하고, 안의 span을 table-cell로 만들어 그 안에서 중앙 정렬할 수 있도록 vertical-align: middle을 주는 비결. 이미 잡지에서도 사용 가능하다.

※position에서 반 정도 누르고 자신의 크기의 반(translate-50%)만큼 잡는 방법.주의점:IE9이상에서 동작한다.

※한 00%의 높이를 가진 부모 앞에 한 00%의 높이를 가진 봇크스하쟈싱룰 둔다. 그 박스에 vertical-align:middle을 주고 그 안의 상자가 세로 가운데에 정렬되도록 하는 것. 주의점:IE7이하는 작동하지 않는다.박스의 세로 중앙과 적절히 섞어 쓰면 되겠다:D