Vue+ laravel 模态窗口大小对屏幕大小的适配

Question

我有模态窗口。

<transition name="modal" @close="showModal = false">
        <div class="modal-mask" style="  width: 90% !important;">
            <div class="modal-wrapper">
                <div class="modal-container">
                    <div class="modal-header">
                        <slot name="header">
                            Введите сообщение для
                        </slot>
                    </div>
                    <div class="modal-body">
                        <slot name="body">
                            <textarea rows="10" cols="45" v-model="MessageText" name="MessageText"</textarea>                            
                        </slot>
                    </div>
                </div>
            </div>
        </div>
    </transition>

在小屏幕（手机）上，屏幕超出屏幕。如何让它适应屏幕？

更新

Answer 1

你可以使用模态尺寸

class="modal-dialog modal-lg"

希望这会起作用并确保删除宽度。