Question

我有两个按钮，我想把它们放在一起。我怎么能这样做？每次按钮在另一个下面。这是代码：

CSS：

<style type="text/css">

.button_example{
border:1px solid #B7B7B7; 
text-align: center; 
color: #FFFFFF; 
background-color: #D3D3D3;
}

.button_example:hover{
border:1px solid #B7B7B7; 
text-align: center; 
color: #1f1f1f; 
background-color: #ffffff;
}
</style></head>

和 HTML ：

<div align="right"><a href="http://www.theamazingmonth.pusku.com/rules.html"><input type="button" class="button_example" value="Rules" /></a></div>
<div align="right"><a href="http://www.theamazingmonth.pusku.com/info.html"><input type="button" class="button_example" value="Info" /></a></div>

提前致谢！

Answer 1

查看 jSFiDDLE

删除额外的div标签，并将标签括在一个div标签下

像这样：

  <div align="right">
    <a href="http://www.theamazingmonth.pusku.com/rules.html"><input type="button" class="button_example" value="Rules" /></a>
    <a href="http://www.theamazingmonth.pusku.com/info.html"><input type="button" class="button_example" value="Info" /></a>
</div>

Answer 2

你需要做三件事：

删除align="right"并将其替换为float:right。
删除代码中的额外<br>。
完成按钮后，使用css clear:both添加div。

<强> jsfiddle example

Answer 3

首先 - 你的HTML部分很乱：

<div><a><input/></div></a>
<div><a><input/></div></a>

你应该：

<div><a><input/></a></div>
<div><a><input/></a></div>

第二个 - 如果你想要点击按钮，为什么不使用<button>标签而不是<a><input></a>？

决赛。尝试将此样式添加到div：

float: right;

但是你需要在此之后添加一些clear项。例如：

<br class="clearFloat">

和css

.clearFloat { clear: both; }

Answer 4

删除2个div，仅使用一个div并添加如下所示的CSS：

#butn{
    margin: 0 auto;
    display: block;
}

<div id="butn" align="right">
    <a href="http://www.theamazingmonth.pusku.com/rules.html"><input type="button" class="button_example" value="Rules" /></a>
    <a href="http://www.theamazingmonth.pusku.com/info.html"><input type="button" class="button_example" value="Info" /></a>
</div>

按钮彼此相邻

4 个答案: