css - 列表中的中心元素(CSS)

Question

我需要将这些元素置于我的社交媒体菜单列表的中心(边栏标题下的 4 个图标)。我必须让它们均匀分布(每个元素宽度为 25%，因为我有 4 个)，“ul”显示为表格。但是，每个“li”中的图标都在左边!有任何想法吗 ？谢谢!

http://www.blogderod.com/

.social-navigation {
margin: 0 15% 10%;
display: table;
width: 70%;
}

.social-navigation li {
display: inline-block;
text-align: center;
float: none;
width: 25%;
}

Answer 1

将以下内容添加到您的 CSS:

.social-navigation a,
.social-navigation a:before {
    width: 100%;
}

这使得链接和社交图标都占据了 li 的整个宽度，从而使它们都能正确居中。