부트스트랩 5분할 나누기

 

 

부트스트랩의 그리드 시스템은 12개의 분할된 화면으로 레이아웃을 구성하는 것입니다.
5개씩 하려고 하면 안되는 부분이 있는데 이렇게 추가가 가능합니다.
.col-xs-15,

.col-sm-15,
.col-md-15,
.col-lg-15 {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

패딩값은 10px이나 15px 이나 알아서 설정하세요.

.col-xs-15 {

    width: 20%;
    float: left;
}

@media (min-width: 768px) {
.col-sm-15 {
        width: 20%;
        float: left;
    }
}

@media (min-width: 992px) {
    .col-md-15 {
        width: 20%;
        float: left;
    }
}

@media (min-width: 1200px) {
    .col-lg-15 {
        width: 20%;
        float: left;
    }
}

 

 

추가로 1/5 외에 2/5, 3/5, 4/5도 아래와 같이 추가가 가능합니다.

.col-xs-25 {
width: 40%;
float: left;
}

.col-xs-35 {
width: 60%;
float: left;
}

.col-xs-45 {
width: 80%;
float: left;
}

 

 

 

 

출처 
https://code.i-harness.com/ko/q/9e811c

 

https://eond.com/coding/395372