DBILITY

상위 element가 모두 100%여야 가능한가? html, body { margin: 0; height: 100%; overflow: hidden; } /* container-fluid */ .container-fluid { height: 100%; } .row { height: 100%; min-height: 100%; } .col { height: 100%; min-height: 100%; } .main { height: 100%; min-height: 100%; background-color: #eeeeee; overflow: hidden; }

div에 css를 통해 가로길이를 정해주는 기능으로 정해준 길이만큼 공간 점유 가로 한줄을 12등분하여 비율로 정해 배치할 수 있다. 기본 코드형태는 다음과 같다. col-칸수 형태는 bootstrap4에서만 지원한다. bootstrap3에선 col-scale-숫자 형태로 12등분 중 몇칸을 점유할지 설정한다. scale은 extra small,small, middle, large, extra large순이다. col-sm-숫자 : 576px이하면 세로로 배치 col-md-숫자 : 768px이하면 세로로 배치 col-lg-숫자 : 992px이하면 세로로 배치 col-xl-숫자 : 1200px이하면 세로로 배치 쉽게 사용하도록 도움이 되는 사이트는 아래와 같다. Shoelace - Visual Bootst..