2017-07-31 5 views
-2

ブートストラップのコンテナをxlスクリーン用に100%-246pxにする方法はありますか?ブートストラップSASSコンテナのサイズ(calc)()

私はvariables.scssファイルでこの変更を試みましたが、同じ値のパーセントとピクセルを使って試したときにエラーが発生しました。

// Grid containers 
// 
// Define the maximum width of `.container` for different screen sizes. 

$container-max-widths: (
    sm: 540px, 
    md: 720px, 
    lg: 960px, 
    xl: calc(100% - 246px) <- this is when I get an error 
) !default; 
@include _assert-ascending($container-max-widths, "$container-max-widths"); 

もう一つの仕事は周り123pxにそれぞれの側に、コンテナのパディングを増加させることが、それを得るために変更することがどの変数わからない場合があります。

答えて

0

最も簡単な方法は、必要な比率を得るために、いずれかの側に余白を使用して.container-fluidクラスを使用することです。

https://codepen.io/sidhuko/pen/QMKjQx

HTML:

<div class="example container-fluid"> 
    Test 
</div> 

CSS:

.example { 
    margin: 0 123px; 
} 
関連する問題