[HTML/CSS]画像の回り込み設定とリストタグ
画像を表示し、文字を右側に回りこませえて表示する方法を試していたところ、リストタグ<ul>で困った症状に遭遇。
症状
下記のようにリストの"・"が画像にかぶってしまってしまう。
その際のHTMLソースは以下。
解決方法
<p>タグの文章の表示開始位置が釈然としないが、以下のように改善できた。
HTMLソースは以下。
要は画像の右に、マージンを設けることで、かぶりを無くした。
症状
下記のようにリストの"・"が画像にかぶってしまってしまう。
その際のHTMLソースは以下。
<html> <img style="float:left;" src="WS000032.JPG" /> <p>abcdefg</p> <ul> <li>hhhhhhhhhh</li> <li>iiiiiiiiii</li> </ul> </html>
解決方法
<p>タグの文章の表示開始位置が釈然としないが、以下のように改善できた。
HTMLソースは以下。
<html> <img style="margin-right:20; float:left;" src="WS000032.JPG" /> <p>abcdefg</p> <ul> <li>hhhhhhhhhh</li> <li>iiiiiiiiii</li> </ul> </html>
要は画像の右に、マージンを設けることで、かぶりを無くした。
以上
コメント
コメントを投稿