html - 无法减小 Chrome 和 Opera 中文本区域的大小

标签 html css google-chrome textarea opera

虽然我没有指定最小宽度和高度,但我无法使用鼠标减小文本区域的大小。在 Firefox 中一切正常。这个问题在这里被问到:Can't reduce size of resizable textarea in Chrome , 但我找不到合适的答案,也许有人可以帮助我。

这是我的标记:

<textarea id="textarea" name="textarea"></textarea>

和 CSS:

textarea{
    width: 90%;
    height: 400px;
    border: 2px dashed black;
    border-radius: 12px;
    background-color: transparent;
    font-family: Purisa;
    font-size: 23px;
    padding: 5px;
    margin: 20px auto auto auto;
    outline: none;
    border-color: black;
}

最佳答案

Google Chrome 有某种限制 可以正确地向用户显示内容。因此,他们在 <textarea> 上编辑了调整大小 的默认操作。 .在旧版本的 chrome 中没有限制。

所以如果你使用 height min-height将是你的高度。所以你需要设置 min-heightmax-height只要。 Height覆盖 Chrome 中的最小高度。

这是一个简单的 fiddle :http://jsfiddle.net/gAr72/1/

编辑:

您可以看到 Firefox 在这个 fiddle 中将与 Chrome 一样工作。顺便说一句,高度对于设计来说是有风险的。无限调整大小总是会破坏设计。所以限制高度和宽度是一个不错的选择。

关于html - 无法减小 Chrome 和 Opera 中文本区域的大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19001074/

相关文章:

jquery - 需要像 textarea 一样调整 Canvas div 的大小吗?

javascript - JS : Bookmarklet - Create a bookmarklet that fires a local js file to fill up fields in a form of the current page

html - 内容较多时如何展开wrapper?(使用CSS)

javascript - <select> 和 <table> 如何整合?

javascript - 调整 <canvas> 元素的大小

css - Ionic-v4 中的侧边菜单背景颜色

html - 当窗口展开时,粘性页脚 flexbox 在 chrome 上失去背景颜色

javascript - 使用 chrome 扩展将文件从本地存储上传到服务器

html - 如何取消选择选择框中的项目?

javascript - 如何更改 div 中的按钮类,而只有最后一个可以保留更改?