掲示板/スタイルシート質問板/過去ログ/一覧/ Firefoxでテーブル内に配置した画像にできる余白について

0 名前：れい： 2007/04/07（土） 01:36 ID:PcaN7UNb sub-t1

はじめまして、こんにちは。
標記の件に関しまして、下記に質問いたします。
ご存知の方がいらっしゃいましたら、ご教授いただけますよう、よろしくお願いいたします。

テーブル内に画像を配置したところ、画像の周りに余白ができてしまいます。

vertical-align:bottom;

は行いましたが、画像が下に下がって、上部に余白が残ったままになってしまいます。
もちろん

margin:0;

padding:0;

も施しています。
下記にソースを記します。

ＨＴＭＬの記述

<div id="header">
<table border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td colspan="2"><img src="images/bar01.gif" width="779" height="5" /></td>
  </tr>
  <tr>
    <td width="574"><img src="images/logo.gif" width="221" height="45" /></td>
    <td width="203"><ul>
      <li><a href="privacypolicy.html">プライバシーポリシー</a></li>
    </ul></td>
  </tr>
  <tr>
      <td colspan="2"><img src="images/bar02.gif" width="779" height="2" /></td>
  </tr>
</table>
</div>

ＣＳＳの記述

/* for header */
#header		{margin:0px;
		padding:0px;
		color:#666666;}

#header table	{width:779px;}

#header td	{padding:0px;
		bmargin:0px;}


h1		{font-size:10px;
		margin:0px;}

#header img	{margin:0px;
		vertical-align:bottom;
		padding-top:0px;}

#header ul	{margin:0;
		text-align:right;
		line-height:1.0;
		list-style:url(../images/ppmark.gif);}

#header li	{display:outline;
		padding:0px 5px;
		font-size:12px;}

本当はＴＡＢＬＥではなく、ＦＬＯＡＴかＰＯＳＩＴＩＯＮで配置するべきなのでしょうが、
なかなかうまくいかなかったので、ＴＡＢＬＥ使用でレイアウトを行っています。

以上、よろしくお願いいたします。

1 名前：元帥： 2007/04/07（土） 01:36 ［URL］ ID:D0w4B2gM sub-bK: ブラウザによっては、img要素にも多少のマージンが設定されています。
marginを0にしてみてはどうでしょうか。

> なかなかうまくいかなかったので、ＴＡＢＬＥ使用でレイアウトを行っています。

そのソースかURLを提示すれば誰かがアドバイスしてくれるかもしれません。

2 名前：れい： 2007/04/07（土） 01:36 ID:PcaN7UNb sub-t1

元帥さん

お返事ありがとうございます。

margin:0;

の設定を施しましたが、効果を得られませんでした。涙

と半ば諦めかけていたら、

display:block;

の存在を知りました！
このお陰で、解決いたしました！！！

ご報告が遅れてスミマセンでした！