使用CSS在圖像旁邊對齊文本

Question

如何在菜單文本旁邊對齊方形圖像。

小提琴

我試過了

vertical-align: middle

但這似乎不起作用。

Answer 1

您必須在img本身（而不是li vertical-align:middle添加vertical-align:middle 。

CSS

#cssmenu ul li img {
    vertical-align: middle;
}

工作-jsFiddle在這里

Answer 2

只需添加vertical-align: middle; IMG標簽。 為我工作。

<li class='active'>
  <a href='#'>
    <img src="http://upload.wikimedia.org/wikipedia/commons/5/55/Box_square.gif" 
      style="padding:10px; vertical-align: middle;" width="24" height="24">
    <span>Menu1</span>  
  </a>
</li>

另外，height和width屬性不需要“ px”單位。