- 締切済み
画像と同じ行に文字を並べると文字が上にずれてしまいます。
ホームページ作成時の以下のテクニックについて教えてください。 画像と同じ行に文字を記入すると、文字が少し上にずれてしまいます。 例えば、フォントを10ポイント、行間隔を14ポイントしたとき、1px×1pxくらいのミニ画像を文字と同じ行に入れると、その画像の入っている行だけが少し上にずれてしまいます。これを修正する良い方法はありませんでしょうか。 なお、テーブル（表）などで区切って調節するような方法は、行換えなどの点で面倒なので、これ以外の方法をお教えください。 宜しくお願いします。
- hanacoara
- お礼率0% (0/3)
- ホームページ作成ソフト
- 回答数3
- ありがとう数2
- みんなの回答 （3）
- 専門家の回答
みんなの回答
- sa_ya07
- ベストアンサー率36% (49/136)
ソースありがとうございました。 当方でも再現ができました。 どうもテーブル内にイメージがある場合、 line-height指定は効かないようです。 面倒かもしれませんが、どうしても行間を指定したいようでしたら 面倒ですがテーブルを使用するしかないのではないでしょうか？ お役に立てず申し訳ありません。 頑張ってくださいね。
- sa_ya07
- ベストアンサー率36% (49/136)
状況は分かりましたが、 私の方では再現できませんでしたので (ちなみに文章のフォントや間隔は<div class=～>で指定しました) もしよろしければソースを公開頂ければと思います。
- ----------
- ベストアンサー率30% (30/98)
状況がよくわかりませんが、 imgのところを <img src="～" align="left">とalignを付け加えてみればどうなりますか？
補足
うまく説明できなくてすみません。 例えば、 1行目の文章○△です。 2行目の文章○△（ここに画像を配置）□△です。 2行目の文章○△です。 という文章があったとき、画像の入り込んだ2行目だけが上に浮き上がってしまうのです。原稿作成時はそのように見えないのですが、プレビュー表示してみると、明らかに1行目と2行目の行間隔が狭くなってしまいます。 ちなみに、1ピクセルの画像というのは、アフィリエイトのテキスト広告なので、構文改変となるようなalignなどは付け加えることができません（ついでにいうと、leftとしても何の変化もありません）。 説明不足ですみませんでした。皆様からのアドバイスをお待ちしています。
補足
ソースは、以下のような感じです。「まみむめも」の部分がリンクになっていますが、「ま」の前に1ピクセルの画像が入っています。この画像の上下の行間が、他の行間よりも多少狭くなってしまいます。 ご確認いただければ幸いです。よろしくおねがいします。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <TITLE></TITLE> <style type="text/css"> <!-- body,td,th { font-size: 10pt; } IMG{border-style : none none none none;} //--> </style> </HEAD> <BODY topmargin="0" marginheight="0" leftmargin="0"><CENTER> <CENTER></CENTER> </CENTER> <TABLE width="200" cellpadding="8" cellspacing="0"> <TBODY> <TR> <TD style="font-size : 12pt;line-height : 22pt;"> あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほ<A href="http://ck.jp.ap.hogehoge.com/" target="_blank"><IMG src="http://ad.jp.ap.hogehoge.com/" height="1" width="1" border="0">まみむめも</A>やゆよらりるれろわをん。 あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほやゆよらりるれろわをん。</TD> </TR> </TBODY> </TABLE> </BODY> </HTML>