html - HTML: スパン テキストを画像に水平方向に配置する

Question

スパンテキストを画像に水平に揃えようとしています:

<div >
      <img src="c:\work\img\logo3.jpg" width="80" height="80" />
      <span><ul>YAD<li>HIM</li></ul></span>
    </div>

単語を入れる理由<ul>は、改行を実現するためです。

詳細については、http: //jsfiddle.net/himanshuy/4LKhX/を参照してください。

Answer 1

それらを中央に配置するには、 に追加text-align: center;してdiv.boxから削除margin-leftしspanます。また、に追加display: block;すると、混乱spanを取り除くことができます。<ul>YAD<li>HIM</li></ul>

フィドル: http://jsfiddle.net/W6ATN/

Answer 2

これを試してください： http://jsfiddle.net/W6ATN/8/

div.box {
  background-color: #000000;
  color: #FFFFFF;
  width: 300px;
  height: 400px;
  text-align: center;
}
span {
  //margin-left: 10%;
  font-size: 30px;
  color: red;
  clear:both;
  display: block;
}
#mymessage{
       padding-top: 50%;
}