[Vuejs]-Dynamic width modal?

2👍

One way you can achieve this is to override the provided classes. As opposed to using a display: table-cell on the modal-wrapper, you can instead use a flexbox:

.modal-wrapper {
    display: flex;
    align-items:center;
    justify-content:center;
    height:100%;
}

Then, on the modal-container you just need to set the display to inline-block and the width to auto:

.modal-container{
    display:inline-block;
    width:auto;
}

Here’s your JSfiddle link based on VueJS’s example

Leave a comment