Programming/기본 (Baisc)
[HTML] ul > li 구조에서 세로 가운데 정렬(Vertical-align) 하는 방법
1. 개요 ul > li 목록형 구조 작성 과정에서 세로 정렬이 되지 않아, 여러 방법을 찾아 보던 중 가장 HTML가 친숙하고 쉬운 방법으로 세로 정렬 구성을 할 수 있는 방법을 찾아 기록한다. 2. 작성 방법 1) CSS 구성 "li:before" 구성을 하게되면 "display: inline-block"을 통해 최초 초기 설정을 해준다. content "싱글쿼터"를 넣게되면 기본 사이즈가 지정된다. ul li:before { display: inline-block; vertical-align: middle; content: ''; height: 100%; } ul li { width: 100%; height: 38px; border-bottom: 1px solid blue; } 2) HTML 태그는..
2023. 10. 16. 21:18