Question

我正在尝试像fontawesome这样的东西，并希望将图标居中：

 <div class="col-md-2">
        <i class="fa fa-bandcamp" aria-hidden="true"></i>
 </div>

没有使用特殊类todo这个，我怎么能用css管理？我尝试过text-align，center等？

Answer 1

如果您can use flexbox，可以通过align-items和justify-content轻松解决问题。添加border只是为了显示div的一面。

＆＃13;

<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>

<div class="container">
<div class="row">
 <div class="col-md-2" style="border: 1px black dotted; display: flex; align-items: center; justify-content: center; height: 50px;">
        <i class="fa fa-bandcamp" aria-hidden="true"></i>
 </div>
</div>
</div>

＆＃13;

如何水平和垂直居中我的图标？

1 个答案: