如何设置 <textarea>
占用浏览器窗口的 100% 宽度和高度?
例如,以下内容不起作用:
html, body, textarea {
margin: 0;
padding: 0;
border: 0;
width: 100%;
height: 100%;
}
<textarea>Text goes here</textarea>
因为它占用了略高于 100% 的窗口,导致出现滚动条:
我如何制作 <textarea>
占用 100% 的空间?
红利阅读
- How to set width and height of textarea
- How to set a Textarea to 100% height in Bootstrap 3?
- I want to set the height of a TextArea to 100% of a Table Cell in XHTML 1.0 Transitional
- I have a textarea that won't have 100% in width when I set it in CSS or plain HTML?
- How can I make a TextArea 100% width without overflowing when padding is present in CSS?
- Textarea to fill a parent container exactly, with padding
- How to have a textarea at 100% width and keep its margin?
- 100% textarea problem
最佳答案
问题是 common white space issue inline-block
/inline
元素由于垂直对齐。如果你检查谷歌的开发工具,你会看到这个:
因此,要修复它,您只需调整垂直对齐方式或使文本区域成为 block 元素(如其他答案中提供的那样):
html, body, textarea {
margin: 0;
padding: 0;
border: 0;
width: 100%;
height: 100%;
}
textarea {
vertical-align:top;
}
<textarea>Text goes here</textarea>
关于html - 如何将文本区域设置为 100% 宽度和高度?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50160860/