如何使边距折叠与输入类型=按钮/提交一起工作？

Question

考虑以下代码：

<p style="margin: 30px 0; padding: 0;">Some text some text some text some text some
text some text some text some text</p>

<p style="margin: 30px 0; padding: 0;">Some text some text some text some text some
text some text some text some text</p>

<input type="button" value="Button" style="margin: 30px 0; padding: 0; float: right;"/>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

最后一个p30px边距code> 和 input 但有 60px 边距。显然保证金崩溃不起作用。如何修复input的CSS规则，同时保持input在顶部产生30px垂直边距的能力？

Answer 1

尝试在 input 上设置 display:block

编辑：然后在它周围扔一个包装器？

http://jsfiddle.net/8mqHZ/13/

Answer 2

我找到的唯一解决方案：

<div style="text-align: right; margin: 30px 0;">
    <input type="button" value="Button" />
</div>​​​​​​​​​​

一点点破解。