重要なお知らせ

「教えて! goo」は2025年9月17日(水)をもちまして、サービスを終了いたします。詳細はこちら>

電子書籍の厳選無料作品が豊富!

会社の同好会のホームページを作って公開しています。画面が左右2段構成にしており、左側に箇条書きしたメニューが10ケ程並んでいます。

(質問)
「New」という画像(.gif)を箇条書きメニューの途中に入れたら行間が狭くなってしまいました。これを他の行と同じスペースにするにはどうすればよろしいのでしょうか?

現在の設定:
箇条書きメニューの行間はCSSでline-height:150%; として多少広めに設定しています。

また「New」という画像はメニュー項目の最後に画像挿入で入れています。(多分入れ方が悪いのだと思います)画像は文字(12px)の半分くらいの高さです。

イメージとしてはYahoo!等のトップページに新着情報、ニュース項目が箇条書きになっていて、特に新しいものや強調したい情報に「NEW」という画像をメニュー文字の最後に付けたいのです。

A 回答 (3件)

<li style="margin-bottom: ●px;">最終項目</li>


<li><img ・・・></li>

●に開けたい隙間の数値を。

<li><img ・・・></li> にマージントップでもいいですし、

<li>最終項目</li>
</ul>
<p><img ・・・></p>

でも開きますし、ul の最後を背景設定にしたり色々方法があります。
    • good
    • 0

画像のタグを


<img src="-----/new.gif" class="listnew" />のようにして、
CSSのほうで
.listnew{
margin:2px 0px 2px 0px;
}
のようにするのはどうでしょうか?
    • good
    • 0

これだけでは判断できませんので、その部分のソースを載せてください。

    • good
    • 0

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!