将图像列表项对齐到水平中心

Question

我希望我的脸书图标在中心对齐（水平不垂直，以便它在我的折叠按钮和推特图标之间）。我尝试了文字对齐，但它无法正常工作.. ！我可以用其他任何方式吗？

我的相关HTML代码

<button type="button" style="float:left;" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button>
<ul>
  <li class="horiz1">
    <a href="http://www.facebook.com/" target="blank"><img src="img/facebook.png" style="width:28px;" ></a>
  </li>
  <li class="horiz">
    <a href="http://www.twitter.com/" target="blank"><img src="img/twitter.png" style="width:35px;" ></a>
  </li>
</ul>

我的相关CSS代码

.horiz { display: inline; float: right;}
.horiz1 { display: inline;}

Answer 1

使用margin-top使其降低一点。 编辑：尝试使用：

.horiz
{
    margin:0 auto;
    display:inline;
    float:right;
}

Answer 2

  

我尝试过text-align但是它没有工作..

你在哪里尝试过？ 将该属性应用于ul标记，例如......

ul {
    text-align: center;
}

http://jsfiddle.net/gmolop/ovwnw90u/

Answer 3

将图像的高度设置为等于让它们居中。