我有以下代码段:
<html>
<body>
<div style="width: 700px;">
<span>test</span>
<input style="width: 100%;"></input>
</div>
</body>
</html>
但这不符合我的要求.我希望跨度和输入一起占据div的100%,即输入将从跨度结束处开始并填充到div的宽度,而不会破坏到下一行.我怎么做？
如果您需要适当的流体宽度:
请参阅: http ://jsfiddle.net/kxEML/
CSS:
.inputContainer {
width: 300px;
border: 1px dashed #f0f
}
.inputContainer label {
float: left;
margin-right: 5px;
background: #ccc
}
.inputContainer div {
overflow: hidden;
}
.inputContainer input {
width: 100%;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
display: block
}
HTML:
<div class="inputContainer">
<label>test</label>
<div><input /></div>
</div>