Bootstrap，表，居中按钮

我有一个表格，我想在其中放置一个下拉按钮。我不能居中按钮，我尝试了很多东西。有没有办法做到这一点？Bootstrap，表，居中按钮

<table class = "table table-hover table-condensed"> 
<tr> 
    <th class = "text-center"> 
    Test 
    </th> 
</tr> 
<tr> 
    <td> 
    <div class="col-md-3 text-left"> 
     <div class="button-group"> 
     <button type="button" class="btn btn-default btn-sm dropdown-toggle" data-toggle="dropdown"><span class="glyphicon glyphicon-cog"></span> <span class="caret"></span></button> 
      <ul class="dropdown-menu"> 
      <li><a href="#" class="small" data-value="Option1" tabIndex="-1"><input type="checkbox"/>&nbsp;Option1</a></li> 
      <li><a href="#" class="small" data-value="Option2" tabIndex="-1"><input type="checkbox"/>&nbsp;Option2</a></li> 
      </ul> 
     </div> 
    </div> 
    </td> 
</tr> 
</table>

来源

2017-10-05 Neil Aggarwal

将类“文本中心”放在这个div中。下面是codepen到see：

<div class="button-group text-center">

还拿带走COL-MD-3和文本从左边包含div的类

来源

2017-10-05 03:17:14

非常感谢，Dream_Cap。我看到它向右移动了一点，但没有居中。我如何直接在“Test”文本下面找到它？ –

我更新了帖子。对于那个很抱歉。谢谢。 –

繁荣，谢谢！ –

只是删除col-md-3 text-left和按钮的父DIV添加text-center。检查以下更新片段...

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
 

 
<script src="http://code.jquery.com/jquery-3.1.1.js"></script> 
 

 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> 
 
<table class = "table table-hover table-condensed"> 
 
     <tr> 
 
      <th class = "text-center"> 
 
      Test 
 
      </th> 
 
     </tr> 
 
     <tr> 
 
      <td> 
 
      <div class="text-center"> 
 
       <div class="button-group"> 
 
       <button type="button" class="btn btn-default btn-sm dropdown-toggle" data-toggle="dropdown"><span class="glyphicon glyphicon-cog"></span> <span class="caret"></span></button> 
 
        <ul class="dropdown-menu"> 
 
         <li><a href="#" class="small" data-value="Option1" tabIndex="-1"><input type="checkbox"/>&nbsp;Option1</a></li> 
 
         <li><a href="#" class="small" data-value="Option2" tabIndex="-1"><input type="checkbox"/>&nbsp;Option2</a></li> 
 
        </ul> 
 
      </div> 
 
      </div> 
 
     </td> 
 
     </tr> 
 
    </table>

来源

2017-10-05 03:20:14

Bootstrap，表，居中按钮

回答

相关问题