html - 问题在 div 中居中 ul 元素

Question

我遇到了将我的 ul 元素置于我的 div 中的问题。我使用了 margin: 0 auto 技术，但它在这种情况下不起作用。此外，我一直有一个问题，是否需要将宽度设置为 div 中的 ul 元素才能使用 margin: 0 auto 有办法解决这个问题吗？

html:

<div class="col-3-12">
            <div class="sidebar-personal-information">
                <div id="sidebar-social-media">
                    <ul id="sidebar-social-media-list">
                        <li><img class="sidebar-social-media-icons" src="images/linkedin.png"></li>
                        <li><img class="sidebar-social-media-icons" src="images/twitter.png"></li>
                    </ul>
                </div>
             </div>
           </div>

CSS:

.sidebar-personal-information {
    background-color: #00a8df;
}

#sidebar-social-media {
    margin: 0 auto;
    padding: 10px;
    vertical-align: center;
}
ul#sidebar-social-media-list{
    width: 100%;
    margin: 0 auto;
}



#sidebar-social-media ul li {
    display: inline;
}

Answer 1

看看this Fiddle
通过将 text-align: center 添加到 CSS 中的 #sidebar-social-media 中，问题应该得到解决。

感谢 Vitorino Fernandes，我想发表评论，但我没有足够的声誉。