输入框100%宽度,标签左侧 [英] Input box 100% width, with label to the left
本文介绍了输入框100%宽度,标签左侧的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我试图有一个流畅的输入框具有100%的宽度,而标签浮在左边。这是我目前有的:
I'm trying to have a fluid input box with 100% width, while having the label floated to the left. Here's what I currently have:
.left{
float: left;
}
input{
width: 100%;
}
<form>
<label class="left">Name:</label>
<input class="left" id="name" name="name"/>
<div class="clear"></div>
</form>
这样可以工作,但是它落在标签下面。如果我使用父div来分配浮动,那么它不跨越100%。任何想法?
This works, however it drops down below the label. If I use a parent div to assign the floats, then it doesn't span 100%. Any ideas?
谢谢!
推荐答案
: http://jsfiddle.net/r2769/ (调整窗口大小)
CSS :
.left {
float: left;
}
.left2 {
overflow: hidden;
display: block;
padding: 0 4px 0 10px
}
.left2 input {
width: 100%
}
HTML:
<form>
<label class="left" for="name">Name:</label>
<span class="left2"><input id="name" name="name" /></span>
</form>
方法说明在这里。
这篇关于输入框100%宽度,标签左侧的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文