无法调整非模态 html 对话框设置 style='resize:both' 但适用于模态对话框

Question

在非模态对话框上使用 style='resize:both' 无效。下面是要测试的代码。这是错误的预期行为吗？

<!DOCTYPE html>
<html>
    <head>
        <title>resize test</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">       
    </head>
    <body>
        <dialog  id='alertDialog' style="resize:both">     
            <div id='out'>You should never see this</div>         
            <hr>
            <button>Ok</button>
        </dialog>
        <script>
            // document.getElementById('alertDialog').showModal(); // <=  can resize
            document.getElementById('alertDialog').show(); // <=  can NOT resize
        </script>

    </body>
</html>

Answer 1

试试这个：

    <dialog  id='alertDialog' style='overflow:auto;resize:both;min-height:10px;'>

无法调整非模态 html 对话框设置 style='resize:both' 但适用于模态对话框

can not resize non modal html dialog setting style='resize:both' but works with modal dialogs

html

css

dialog

resize

non-modal