Question

enter image description here我的内部有两个按钮，我需要将它对齐在中心

    <td align="center">
        <form action="ReplyFound" method="post"  class="pull-left">
            <a class="btn btn-default "><em class="fa fa-pencil"></em></a>
        </form>

        <form action="DeleteMessage" method="post"  class="pull-left">
        <a class="btn btn-danger "><em class="fa fa-trash"></em></a>
        </form>
    </td>

Answer 1

尝试：

display: block;
margin: auto;

Answer 2

您可以使用以下html进行此操作

<td class="text-center">
    <form action="ReplyFound" method="post"  class="btn-block">
        <a class="btn btn-default "><em class="fa fa-pencil"></em></a>
    </form>

    <form action="DeleteMessage" method="post"  class="btn-block">
    <a class="btn btn-danger "><em class="fa fa-trash"></em></a>
    </form>
</td>

Answer 3

缺少结束标记</form>。

如果宽度为包装内容时未定义宽度。

<table style="width:100%">
  <tr>
    <td align="center">
        <form action="ReplyFound" method="post"  class="pull-left">
            <a class="btn btn-default ">Edit</a>
</form>
        <form action="DeleteMessage" method="post"  class="pull-left">
        <a class="btn btn-danger ">Delete</a>
        </form>
      </td>
    </tr>
</table>

Answer 4

您可以使用此

.centerBtn{
display:inline-block;
}

<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<table style="width:100%">
<tr>
<td align="center" >
<div class="centerBtn">
        <form action="ReplyFound" method="post"  class="pull-left">
            <a class="btn btn-default "><em class="fa fa-pencil"></em></a>
        </form>

        <form action="DeleteMessage" method="post"  class="pull-left">
        <a class="btn btn-danger "><em class="fa fa-trash"></em></a>
        </form>
        </div>
    </td>
    </tr>
    </table>

Answer 5

试试这个：

.divCenter {

  width: 100%;
  max-width: 960px;
  margin: 0 auto;
  text-align: center;

}

.pull-left {

  display: inline-block;
  margin: 5px;
  background-color: #000;
  color: #fff;
	
}

<div class="divCenter">

  <td align="center">

    <form action="ReplyFound" method="post"  class="pull-left">
            <a class="btn btn-default "><em class="fa fa-pencil">Button1</em></a>
    </form>

   <form action="DeleteMessage" method="post"  class="pull-left">
           <a class="btn btn-danger "><em class="fa fa-trash">Button2</em></a>
   </form>

  </td>

</div>

如何将按钮居中对齐？

5 个答案: