静的幅（col-xl- *）（ブートストラップ4）？

Question

col-xl- *では、より大きなモニターでは成長が止まるのをどのようにして禁止できますか？ ラップトップ（1280幅）とデスクトップ（1920）で見ると、どちらもcol-xlに適用されますが、デスクトップ上では大きすぎるか、ラップトップでは小さすぎます。

<div class="d-flex justify-content-center align-items-center text-center login-div "> 
    <div class="col-md-6 col-sm-8 col-lg-5 col-xl-3 col-10 rounded-10 mask"></div> 
</div> 

ありがとうございます。

Answer 1

一つのオプションは、ブートストラップのXL breakpointのために、おそらく、media queriesを使用してmax-widthを定義することです：

@media (min-width: 1200px) { /* xl */ 
 

 
    .your-class { 
 
    background: yellow; 
 
    max-width: 200px; 
 
    } 
 
}

<div class="your-class">Hello</div>

上記のコードを使用して、クラス.your-class持つ要素が200pxの最大の幅を持つことになりますビューポートの幅が1200ピクセル以上の場合。