我有一个高大的 INPUT (type=text) 元素,其大小为 100%。包含元素具有特定高度(这是动态的)。
我想要的是能够将文本放在 INPUT 元素的顶部。我见过 few answers使用填充使其垂直居中,但我无法将文本放置在元素的顶部。我无法设置元素的高度。
示例 HTML(或 JSFiddle):
<body>
<div class="outer">
<input type="text" value ="textcontent"></input>
</div>
</body>
和 CSS:
body { background-color:gray;}
.outer {
height:480px;
background-color:pink;
margin-top:100px;
}
input {
height:100%;
background-color:lightgray;
padding-top:0px;
line-height:100px;
}
不设置元素的高度能做到吗?我需要支持的浏览器:Chrome、FF、IE9 和 IE11。
谢谢 戴夫
最佳答案
如果您只想输入元素并实现此目的,请设置 padding-bottom 而不是高度。
设置高度后,默认情况下文本将显示在元素的中间。
input {
padding-bottom: 462px;
background-color:lightgreen;
}
关于html - 如何垂直顶部对齐 INPUT 文本元素中的文本?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27249438/