2 个 HTML 表单并排
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/1272419/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
2 HTML forms side to side
提问by Natalie Downe
I need to put a Confirm button and a cancel button in a page.
我需要在页面中放置一个确认按钮和一个取消按钮。
I chose to create to forms with different actions, but the 2 buttons (forms) are not displayed side-to-side.
我选择创建具有不同操作的表单，但 2 个按钮（表单）没有并排显示。
How do we do it without a table?
没有桌子我们怎么办？
Thank you!
谢谢！
回答by Natalie Downe
You can do this without floats, if you set the form and every element inside it to be display inline then they will sit next to each other. The reason they are not side by side is because forms, just like divs and paragraphs are block level elements, setting them to be display inline will fix this.
您可以在没有浮动的情况下执行此操作，如果您将表单和其中的每个元素设置为内联显示，那么它们将彼此相邻。它们不并排的原因是因为表单，就像 div 和段落一样是块级元素，将它们设置为内联显示将解决这个问题。
For Example
例如
.button-container form,
.button-container form div {
display: inline;
}
.button-container button {
display: inline;
vertical-align: middle;
}
With the following HTML
使用以下 HTML
<div class="button-container">
<form action="confirm.php" method="post">
<div>
<button type="submit">Confirm</button>
</div>
</form>
<form action="cancel.php" method="post">
<div>
<button type="submit">Cancel</button>
</div>
</form>
</div>回答by Dmitri Farkov
Make both "float: left". And make the element after them "clear: both";
使两者都“浮动：左”。并使它们之后的元素“清楚：两者”；
Should work :)
应该管用 ：）
回答by Azarsa
As is said if you want inline elements, make them inline. This is better:
如前所述，如果您想要内联元素，请将它们内联。这个更好：
display:inline-block;
