html - css を使用して画像の横にテキストを配置する

Question

正方形の画像をメニュー テキストの横に配置するにはどうすればよいですか。

フィドル

私は試した

vertical-align: middle

しかし、それはうまくいかないようです。

Answer 1

vertical-align:middleではなく、imgそれ自体に追加する必要がありliます。

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>

また、高さと幅の属性には「px」単位は必要ありません。