html - 添加 margintop 或 bottom 到列表项

Question

我有一个包含文本和两个图标图像的列表。文本与图像不对齐，所以我希望能够为链接添加边距。然而，经过至少一个小时的检查我仍然无法让它工作，这是我的代码:

<div class="company-info pull-right">



                    <ul class="social-header">

                    <li>Follow Us</li>
                    <li class="socials"><a href="#" title="follow us on twitter"><i class="twit-icon"></i></a></li>
                    <li class="socials"><a href="#" title="Folow us on LinkedIn"><i class="linked-icon"></i></a></li>


                    </ul><!--/social header-->

            </div><!--/pull right-->


        </div><!--/company info-->

    .social-header{
    list-style:none;
}

.social-header li{
    display:inline;
}

.social-header li.socials{
    margin-top:10px;
}

Answer 1

margin 不会在内联元素上工作。

.social-header li{
    display:inline-block;
    float: left;
}



.social-header li.socials{
    padding-top:10px;
}