输入内容时，移动浏览器会调整文本区域的大小

Question

我正在设计一个基本的记笔记PWA，并且我的网站（ https://cloudwerewolf.github.io ）在台式机浏览器上以及在以PWA从手机主屏幕上启动时都可以正常工作，但是在从直接导航到链接，单击其中一个时所有文本区域都会缩小，我希望文本区域保持与以前相同的大小，而不是缩小。 是由于键盘缩小了屏幕的感知宽度，还是还有其他原因，如何解决？

编辑：发现并解决了问题：

@media screen and (orientation:landscape) {
    textarea {
        width: 43.5%;
    }
    #notehead {
        width: 20.5%;
    }
    #reH {
        font-size: 24px;
    }
}
@media screen and (orientation:portrait) {
    textarea {
        width: 80%;
    }
    #notehead {
        width: 35%;
    }
}

当键盘出现在我的屏幕上时，由于视口宽度现在小于视口高度，CSS决定方向现在为横向，并相应地更改了文本区域的大小和字体大小。 我取出了那段代码，并将其替换为放置在常规textarea {}和#notehead {} CSS区域中的纵向模式的宽度百分比，并以像素为单位设置了最大宽度，以防止文本区域在桌面上变得太宽。

Answer 1

在CSS中，您将textarea配置为min-width: 80% ，因此，当减小屏幕大小时，textarea将减小直到达到此处的限制（80％），textarea不会减小。

尝试将min-width: 80%减小为min-width: 80% min-width: 20%

请尝试在问题中显示您的代码，我们可以通过这种方式帮助您解决问题，而不仅是指向您网站的链接。