부트 스트랩 4 (알파 3) : 카드 열 - 사용자 정의 된 열 수

Question

부트 스트랩 4 (알파 3) 카드 콜럼스에서 사용하고 열 수를 사용자 정의하려고합니다. 기본 열 수가 (SM 장치 제외) 3으로

.card-columns { 
     @include media-breakpoint-only(lg) { 
     column-count: 4; 
     } 
     @include media-breakpoint-only(xl) { 
     column-count: 5; 
     } 
    } 

, 내가 추가 CSS 파일에 다음 코드를 사용하여,이 개 컬럼에 기본을 줄이기 위해 시도해보십시오 Docs에서 다음의 예는있다 (부트 스트랩 CSS 이후) :

.card-columns { 
    @include media-breakpoint-only(sm) { 
    column-count: 2; 
    } 
    @include media-breakpoint-only(md) { 
    column-count: 2; 
    } 
    @include media-breakpoint-only(lg) { 
    column-count: 2; 
    } 
    @include media-breakpoint-only(xl) { 
    column-count: 2; 
    } 
} 

그러나 불행히도 결과는 여전히 3 열입니다. 내가 도대체 ​​뭘 잘못하고있는 겁니까?

도움 주셔서 감사합니다.

Answer 1

당신은 media-breakpoint-only ..

.card-columns { 
    @include media-breakpoint-only(xl) { 
    column-count: 5; 
    } 
    @include media-breakpoint-only(lg) { 
    column-count: 4; 
    } 
    @include media-breakpoint-only(md) { 
    column-count: 3; 
    } 
    @include media-breakpoint-only(sm) { 
    column-count: 2; 
    } 
} 

작동 데모를 변경하는 SASS를 사용할 수 있습니다 SASS와 http://codeply.com/go/nHZg5n2vuE