ブートストラップ4モーダル幅（増加）

Question

モーダルが画面幅の80％程度になるようにします。 modal-lgは十分ではありません。この：！

.modal .modal-dialog { 
    width: 80%; 
} 

はあなたのモーダルを容器に入れていない、それは本来のものから幅を変更していない場合は、重要な注釈を追加しようとしていることを確認し、ブートストラップ4と

Answer 1

あなたは、以下の実行して作成するか、または単にmodal-lgブートストラップデフォルトを上書きすることができます。

.modal-lg { 
    max-width: 80%; 
} 

だけで動作していない場合ので、それは今modal-lgを呼び出す

.modal-lg { 
    max-width: 80% !important; 
} 

下回るようになり!importantを追加します。

<div class="modal-dialog modal-lg" role="document"> 
<!-- some modal content ---> 
</div 

Answer 2

を動作しません。

Answer 3

はちょうどのサイズを変更PX

.modal .modal-dialog { 
    width: 850px; 
} 

を使用するようにしてください。

Answer 4

あなたのクラスをオーバーライドするクラスの幅を与えた後に、！importantを使用してください。例

.modal .modal-dialog { 
    width: 850px !important; 
} 

については

うまくいけば、この意志はあなたのために働きます。

Answer 5

あなたはdocumentationによるサス、

を使用している場合は、デフォルト値をカスタマイズすることができます。

あなたの場合、_custom.scssファイルの$modal-lgという変数を簡単に上書きできます。

Answer 6

応答的な回答です。

@media (min-width: 992px) { 
    .modal-dialog { 
    max-width: 80%; 
    } 
}