将两个 HTML 按钮并排放置
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11481606/
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
Making two HTML buttons go side by side
提问by Gavin
Okay, I'm not very familiar with HTML, or how it comes together with CSS. I have been looking all over on how to make two HTML buttons go side by side. Here is the code I'm currently using.
好吧，我不太熟悉 HTML，或者它是如何与 CSS 结合在一起的。我一直在研究如何让两个 HTML 按钮并排显示。这是我目前使用的代码。
<FORM METHOD="LINK" ACTION="LINK TO WEBSITE" target="_blank">
<input type="submit" value="Forum Home Page">
</FORM>
<FORM METHOD="LINK" ACTION="LINK TO A DIFFERENT WEBSITE" target="_blank">
<input type="submit" value="Skill Guides">
</FORM>
No matter if I put them right after each other or put an alignment infront of them. I can't seem to get them to go next to each other. I hope there is someone that can easily and in a detailed way, help me out.
无论我是将它们紧挨着放置还是在它们前面放置对齐。我似乎无法让他们挨在一起。我希望有人可以轻松而详细地帮助我。
回答by Randall Ma
If I understand you correctly, you can just attach the following CSS:
如果我理解正确，您可以附加以下 CSS：
form {
display: inline;
}
As shown here: http://jsfiddle.net/zcz3j/
如图所示：http: //jsfiddle.net/zcz3j/
回答by Satinder singh
Demo http://jsfiddle.net/satinder_singh1/wr4Xv/1/
演示http://jsfiddle.net/satinder_singh1/wr4Xv/1/
<div id="main">
<div class="floatdiv"><FORM METHOD="LINK" ACTION="LINK TO WEBSITE" target="_blank">
<input type="submit" value="Forum Home Page">
</FORM></div>
<div class="floatdiv">
<FORM METHOD="LINK" ACTION="LINK TO A DIFFERENT WEBSITE" target="_blank">
<input type="submit" value="Skill Guides">
</FORM></div></div>?
<style type="text/css">
#main
{
position:relative;
width:200px;
}
.floatdiv
{
float:left;
width=80px
}
</style>
?
?
回答by Stevo
You could also try wrapping them in a table tag. That's how I fixed my similar issue. The table automatically set them side by side.
您也可以尝试将它们包装在 table 标签中。这就是我解决类似问题的方法。桌子会自动将它们并排放置。
