How can I change the width and height of a Modal?

Thank you in advance.



You can override modal CSS on the page you are using it on.

The default is 100%, but you put in px, you can manipulate the size.

.ModalContainer {

    width: 1000px !important;


The same goes for the height.

I hope to help.


Hi João Lopes,

As Conde mentioned that is one way you can handle, but in some scenarios it will give a issues as its fixed size, always go with % rather than pixels. Create class and apply width and height in %, use the same class on model.



as Vanteru said, depending on what you need might be that the size in px will bother you, because it's a fixed size you lose responsiveness. Always good to use percentage, but if your use has no problem, the px will be useful to put in the ideal size for your use.

Thank you for your replies!