Bootstrap4とFontawesomeで以下のロゴを等間隔にバランスよく横並びに表示したいのですが、添付の写真のようにそれぞれのロゴが左に寄ってしまっています。
HTML
1 <div class="container border mt-3"> 2 <div class="row"> 3 <div class="col" style="display: table;"> 4 <i class="fab fa-facebook-f" style="display: table-cell; vertical-align: middle;"></i> 5 </div> 6 <div class="col" style="display: table;"> 7 <i class="fab fa-twitter" style="display: table-cell; vertical-align: middle;"></i> 8 </div> 9 <div class="col" style="display: table;"> 10 <i class="fab fa-instagram" style="display: table-cell; vertical-align: middle;"></i> 11 </div> 12 </div> 13 </div>
ちなみにstyle部分を無くしても、ほとんど変わりませんでした。
###質問する前に参考にしたサイト
-display: table-cell;を利用した方法
-justify-content-*を利用した方法
主にこちらのサイトを参考にしてレイアウトを変えれるか試行錯誤しましたが、解決には至りませんでした。
回答2件
あなたの回答
tips
プレビュー