Bootstrap 4模式寬度（增加）

Question

我想模式爲屏幕寬度的80％左右。 modal-lg不夠大。這：

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

不與引導4.工作安排

Answer 1

您可以創建或只是下面做覆蓋默認引導modal-lg。

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

Answer 2

確保你的模式是不是放置在容器中，嘗試添加的重要註解，如果它不是從原來的一個改變寬度！

Answer 3

嘗試使用PX

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

只是改變大小。如果不工作只是添加!important所以它看起來像下面

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

現在所說的modal-lg

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

：

Answer 4

簡單地使用！重要的是給予該類的寬度覆蓋你的類。

對於實例

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

希望這會爲你工作。

Answer 5

如果你用無禮的話，

根據documentation您可以自定義默認值。

就您而言，您可以輕鬆覆蓋_custom.scss文件中名爲$modal-lg的變量。

Answer 6

對於響應式答案。

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