中心对齐按钮中的图形

Question

我减小了按钮的宽度，并且想要对齐中间的图形。

这里是我的代码：

<div class="btn-group btn-toggle"> 
<button class="btn btn-primary btn-sm" type="button" style="width:20px"> 
<span class="glyphicon glyphicon glyphicon-sort-by-alphabet"></span> 
</button> 
<button class="btn btn-default btn-sm" type="button"> 
<span class="glyphicon glyphicon glyphicon-sort-by-alphabet-alt"></span> 
</button> 
</div> 

这里是一个bootply链接：http://www.bootply.com/HYU6Nff6bk#

如何能不能做到？

Answer 1

该按钮仍然使用padding-left：10px; and padding-right：10px;

如果您想要一个宽度为20px的按钮，则将填充左侧和填充右侧减少为零。

<div class="btn-group btn-toggle"> 
<button class="btn btn-primary btn-sm" type="button" style="width:20px; padding-left: 0px; padding-right: 0px;"> 
<span class="glyphicon glyphicon glyphicon-sort-by-alphabet"></span> 
</button> 
<button class="btn btn-default btn-sm" type="button"> 
<span class="glyphicon glyphicon glyphicon-sort-by-alphabet-alt" aria-hidden="true"></span> 
</button> 
</div>