css - 如何在页脚中对齐社交图标

我有两个<ul>标记，其中包含指向页面的链接和指向社交图标的链接。当我创建第二个<ul>标签以具有如下所示的社交图标时，它们如何对齐？

这是我的网站：https://bgrnature.herokuapp.com/#/contact-us

<footer>
    <div id="footer">
        <div class="container">
            <ul class="nav navbar-nav">
                <li><a ui-sref="home">Home</a></li>
                <li><a ui-sref="about-us">About Us</a></li>
                <li><a ui-sref="faqs">FAQS</a></li>
                <li><a ui-sref="contact-us">Contact us</a></li>
            </ul>

            <ul class="nav navbar-nav navbar-right footer-icons">
                <li><a href="" class="inactiveLink">Copyright © 2016 </a></li>
                <li><i class="fa fa-facebook fa-inverse" aria-hidden="true"></i><a href=""></a></li>
                <li><i class="fa fa-youtube fa-inverse" aria-hidden="true"></i><a href=""></a></li>
                <li><i class="fa fa-linkedin fa-inverse" aria-hidden="true"></i><a href=""></a></li>
            </ul>
        </div>
    </div>
</footer>

底部填充或顶部填充完全无效。我该如何解决？

最佳答案

为社交图标的li创建类，并提供margin-top：15px

.social{
  margin-top:15px;
}

Codepen- http://codepen.io/nagasai/pen/NrpGzL

关于css - 如何在页脚中对齐社交图标，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/38061232/