如何將超棒字體圖標對准中心？

Question

我一直在嘗試將這些字體真棒圖標放在頁面中心，但似乎沒有任何效果。 這是我的代碼

 .center { text-align:center; width:50%; } .icon: { width: 200px; height: 200px; } #icons { display: inline-block; text-align: center; color: black; padding-right: 50px; width: 100px; height: 100px; } 

 <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css"> <div class="center"> <!-- Facebook --> <a href="https://www.facebook.com/faizan.khan.7146" class="icons-lg fb-ic" target="_blank"><i id="icons" class="fa fa-facebook" style="font-size: 65px;"></i></a> <!-- Twitter --> <a href="https://twitter.com/faizan_khan698" class="icons-lg tw-ic" target="_blank"><i id="icons" class="fa fa-twitter" style="font-size: 65px;"></i></a> <!--Github--> <a href="https://github.com/fkhan698" class="icons-sm git-ic" target="_blank"><i id="icons" class="fa fa-github" style="font-size: 65px;"> </i></a> <!--Reddit--> <a href="https://www.reddit.com/user/pakiman698/" class="icons-sm reddit-ic" target="_blank"><i id="icons" class="fa fa-reddit" style="font-size: 65px;"></i></a> </div> 

Answer 1

只需添加中心標簽

    <center>
    <a href="" class="icons-lg fb-ic" target="_blank"><i id="icons" class="fa fa-facebook" style="font-size: 65px;"> </i></a>
<!--   Twitter     -->
<a  href="" class="icons-lg tw-ic" target="_blank"><i id="icons" class="fa fa-twitter" style="font-size: 65px;"></i></a>
        <!--Github-->
<a  href="" class="icons-sm git-ic" target="_blank"><i id="icons" class="fa fa-github" style="font-size: 65px;"> </i></a>
        <!--Reddit-->
<a  href="" class="icons-sm reddit-ic" target="_blank"><i id="icons" class="fa fa-reddit" style="font-size: 65px;"></i></a>
      <br>
    </center>

如果有任何問題請通知我

https://codepen.io/gvsakhil/pen/ZMoVXY我已經添加了Codepen，如果需要的話請簽出

Answer 2

->只需添加保證金：0自動; 在.center類中。

 .center { text-align:center; width:50%; margin: 0 auto; } .icon: { width: 200px; height: 200px; } #icons { display: inline-block; text-align: center; color: black; padding-right: 50px; width: 100px; height: 100px; } 

 <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css"> <div class="center"> <!-- Facebook --> <a href="https://www.facebook.com/faizan.khan.7146" class="icons-lg fb-ic" target="_blank"><i id="icons" class="fa fa-facebook" style="font-size: 65px;"></i></a> <!-- Twitter --> <a href="https://twitter.com/faizan_khan698" class="icons-lg tw-ic" target="_blank"><i id="icons" class="fa fa-twitter" style="font-size: 65px;"></i></a> <!--Github--> <a href="https://github.com/fkhan698" class="icons-sm git-ic" target="_blank"><i id="icons" class="fa fa-github" style="font-size: 65px;"> </i></a> <!--Reddit--> <a href="https://www.reddit.com/user/pakiman698/" class="icons-sm reddit-ic" target="_blank"><i id="icons" class="fa fa-reddit" style="font-size: 65px;"></i></a> </div>