Question

我有这个代码创建一些带有GlyphIcon和一些文本的Bootstrap 3按钮，但问题是文本在图标右侧对齐。如何对齐图标下方的文字？

<div class="btn-group">
    <button type="button" class="btn btn-default btn-lg"><span class="glyphicon glyphicon-file"></span>Archive</button>
    <button type="button" class="btn btn-default btn-lg"><span class="glyphicon glyphicon-trash"></span>Delete</button>
</div>
<button type="button" class="btn btn-default btn-lg"><span class="glyphicon glyphicon-share"></span>Resend</button>

Answer 1

将text-center助手类添加到.btn，并在文字前面的图标后面添加<br>。

<button type="button" class="btn btn-default btn-lg text-center"><span class="glyphicon glyphicon-share"></span><br>Resend</button>

演示：http://www.bootply.com/SWzsbPwPWC

Bootstrap 3对齐GlyphIcon下面的按钮文本

1 个答案: