秘密基地、どこに作った?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN">
<html>
<head>
<style type="text/css">
body{margin:0}
table{border-collapse:collapse}
td{padding:0;}
</style>
</head>
<body>
<table>
<tr><td></td><td></td><td></td></tr>
<tr><td></td><td>

<table style="width:100px;height:100px;background-color:#f93;">
<tr><td></td><td></td><td></td></tr>
<tr><td></td><td>
a
</td><td></td></tr>
<tr><td></td><td></td><td></td></tr>
</table>

</td><td></td></tr>
<tr><td></td><td></td><td></td></tr>
</table>
</body>
</html>

以上のソースをIEで見たとき。よく分からない1pxぐらいの隙間が上に開いてしまいます。
FFで見たときには思ったとおりに表示されるのですが・・・。
どなたか原因が分かる方おられましたら教えてください。

A 回答 (5件)

単純に最初のテーブルタグの<tr>-</tr>分の空白ですね。


以下のソース上で、青の部分が最初のテーブルの枠線部分。
上下に少しだけ有る赤の部分が件の空白に当たる部分です。最初の、<tr>~</tr>までを消せば空白も消えます。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html><head>
<style type="text/css">
body{margin:0}
table{
border-collapse:collapse;
padding:0;
border-style: solid;
border-width: 8px;
border-color: blue;
background-color: red;
}
.aaa{
width:100px;
height:100px;
background-color: orange;
}
td{padding:0;}
</style>
</head>
<body>
<table>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td>
<table class="aaa">
<tr>
<td></td><td></td><td></td>
</tr>
<tr>
<td></td>
<td>a</td>
<td></td>
</tr>
<tr>
<td></td><td></td><td></td>
</tr>
</table>
</td>
<td></td>
</tr>
<tr><td></td><td></td><td></td></tr>
</table>
</body>
</html>
    • good
    • 0

TABLEタグなどに頼らず、すなおにposition/floatで位置決めすればいいだけの事。

    • good
    • 0

>よく分からない1pxぐらいの隙間


連続した改行および空白文字は1文字の空白に置換される。
通常次のようなタグの閉じ記号を次の行の頭にして次の開始タグの開始記号に連続させる方法で表示空白に変換される改行を潰す(バッドノウハウ)

<table><tr
><td
></td
></tr
></table>

この回答への補足

回答ありがとうございます

ためしにtableに関するタグを以下のようにすべて一行で書いてみたんですが
<table cellspacing="0"><tr><td></td>.....</table>(とっても長い
それでもよく分からない1pxの空白はまだ残ってしまいます

補足日時:2007/09/19 13:54
    • good
    • 0

<table cellspacing="0" style="width:100px;height:100px;background-color:#f93;">



cellspacing="0"を追加してください。

思っていることと違っていたらごめんなさい。

タグの組み方(書き方)でおかしいところがあります。
同じものにたいしてCSS設定を二回するのもおかしいと思います。

(タグ打ちのみで行おうとすると間違いに気がつきにくいので、何かソフトを導入して作業してみては如何でしょうか。余談)
    • good
    • 0

外tableに余計な行があるではにでしょうか?


この行と
<tr><td></td><td></td><td></td></tr>
この行(但し<tr>はいる)
<tr><td></td><td>
    • good
    • 0

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


おすすめ情報