我在对话框的下一行有一个文本输入字段和2个按钮。
如何排列对话框中心的输入字段并将按钮对齐到输入字段的右边缘?
我已经设法用以下代码实现了我的结果,但感觉必须有一个更好的方法,因为这也将文本输入对齐到右边:
<style>
.container
{
border: 1px solid #ccc;
text-align: right;
width: 100%;
padding-right: 20px;
}
</style>
<div class="container">
<p><input id="selContactLists" name="selContactLists" type="text" class="textbox" id="textbox" /></p>
<input name="" type="button" value="Button"/>
<input name="" type="button" value="Button"/>
答案 0 :(得分:2)
CSS:
.container {
display: inline-block;
}
input.text {
width: 150px;
display: block;
}
.right {
float: right;
}
HTML:
<div class="container" >
<input type="text" class="text" />
<span class="right">
<input type="button" value="button" />
<input type="button" value="button" />
</span>
</div>
答案 1 :(得分:0)
<style>
.container
{
margin-left:auto;
margin-right:auto;
width:150px;
}
</style>
<div class="container" >
<input name="" type="text" class="textbox" id="textbox" />
<input name="" type="button" style="float:right;" value="Button"/>
<input name="" type="button" style="float:right;" value="Button"/>
</div>
答案 2 :(得分:0)
<style>
.test
{
margin-left:auto;
margin-right:auto;
}
.test td
{
float:right;
}
</style>
<table class="test">
<tr>
<td colspan=2><input name="" type="text" class="textbox" id="textbox" /></td>
</tr>
<tr>
<td><input name="" type="button" value="Button"/> </td>
<td><input name="" type="button" value="Button"/> </td>
</tr>
</table>