<div style="width: 300px">
<div id="one" style="float: left">saved</div><input type="submit" id="two" style="float: right" value="Submit" />
</div>
我希望div#one在父div的左边缘和提交按钮的左边缘之间的空间中居中。
答案 0 :(得分:1)
列出了许多技术here
但是,如果您只是希望将“已保存”文本居中,我认为您需要为#one提供宽度,例如
<div style="width: 300px">
<div id="one" style="float: left;text-align:center;width:80%">saved</div>
<input type="submit" id="two" style="float: right;width:20%" value="Submit" />
</div>
答案 1 :(得分:1)
还有其他几种方法:
<div style="width: 300px">
<input type="submit" id="two" style="float: right" value="Submit" />
<div id="one" style="text-align:center;">saved</div>
</div>
很难说文本saved
不在容器div
的左边缘和提交按钮的左边缘之间居中。
以下是上述内容的确切版本:
<div style="width: 300px;">
<input type="submit" id="two" style="float: right; width:64px;" value="Submit" />
<div id="one" style="text-align:center;margin-right:64px;">saved</div>
</div>
答案 2 :(得分:0)
这是CSS的一般问题的一个例子,即无法计算各种布局中的“剩余空间”。
我遇到过(a)需要精确布局的情况,以及(b)你不知道浮动物品大小的情况。
示例:
[----输入字段占用剩余空间的100%----] [宽度未知的按钮]
你会认为这是可能的,但是AFAIK,你必须使用表来实现这一点。 CSS中甚至没有关于如何在未来修复此问题的建议。 叹息