Need to increase b-modal width. VueJS.Bootsrap
It isn't always practical to make new elements in your CSS file. If you want to adapt something, you always need to search where again have I defined the width, style, did I define it already, ...
I find it easier to include it directly in my code. For b-model, I found the following solution:
<div> <b-modal size="xl" title="Very large model"></b-modal> <b-modal size="lg" title="Large model"></b-modal> <b-modal size="sm" title="Small model"></b-modal></div>It works for my version Bootstrap v4.3.
After debugging the CSS i found that you could add the following CSS rules in order to overwrite the existing ones and make the width more larger :
@media (min-width: 992px) .modal-lg { max-width: auto !important; }@media (min-width: 576px) .modal-dialog { max-width: auto !important; }