中心名单侧一个div(Center List in side a div)

我想我中心与列表一个div内的图像。 这就是我得到（图标的方式太小，不居中）。

这是CSS Ive得到和HTML

       <div id="social">

                <ul>
                    <li><img src="img/footertwitter.png" alt="placeholder+image"></li>
                    <li><img src="img/footerfacebook.png" alt="placeholder+image"></li>
                    <li><img src="img/footeremail.png" alt="placeholder+image"></li>
                </ul>

            </div>


        #social {
margin: 0 auto;
text-align: center;
width: 90%;
max-width: 1140px;
position: relative;
  }

    #social ul {
/*margin: 0 0 3em 0!important;*/
padding: 0!important;

}

  #social ul li {
list-style-type: none;
display: inline-block;
margin-left: 1.5em;
margin-right: 1.5em;
  }

Answer 1:

在你的规则来进行ul考虑设置显示属性块和利润率的汽车。 如果我知道你要完成什么正确的，应该居中你的东西，同时保留您所指派的利润率。

更新后的CSS将如下所示：

#social 
{
  margin: 0 auto;
  text-align: center;
  width: 90%;
  max-width: 1140px;
  position: relative;
}

#social ul 
{
  padding: 0;
  margin:auto;
  display: block;
}

#social ul li 
{
  list-style-type: none;
  display: inline-block;
  margin-left: 1.5em;
  margin-right: 1.5em;
}

这小提琴显示了工作中的变化。 希望帮助。

Answer 2:

1. 您可以根据您的需要简单地增加图标的大小：

   社会UL李IMG {

    width:50px; height:50px; 

   }

2. 给一个固定的宽度UL和然后使用下面的代码把它的中心：

   社会UL {

    width:300px; /*Example*/ display:block; margin:0 auto; 

   }

文章来源: Center List in side a div