ブラウザ・環境の相違

テーブル(IE4,NN4)

空白のレイアウト
NN4.0は何もないテーブルを指定するとテーブルそのものが表示されず､空白を空けることができない。 width,heightをしていしてスペーサーGIFを入れる(nbspではNNとIEで正確にサイズが合わない)

また、これに関連して､テーブルを使用してレイアウト(段組)を作成する時<TD width=XXX></TD>のように何も指定しない場合､未表示になるだけでなく､このタグで全体のカラムサイズを決定する場合(TDにwidth句が指定されていても)以下のテーブルのサイズまで乱すことがある。スペーサーをいれてサイズを指定(TDとIMGに)する。

画像の配置
NN4.0ではテーブルに画像を配置(rowspanを使って縦に連結したテーブル)でテーブルの外(下)へ画像が飛び出しレイアウトが乱れることがある。　<TD><IMG>にheight,widthを指定して画像をセルのサイズに納め、さらにvalign句を指定して表示位置を指定する。画像サイズを指定して収まるはずでももvalign句がないとはみ出てしまうことがある(バグ?)。

文字・行間隔
- NNでは文字間隔の指定ができない(letter-spacing未対応)
- 字間隔の指定をしない時NNはIEに比べ文字間隔がつまる
- NN,IE共に行間隔を指定できる(line-height)が同じ値を設定してもNNのほうが行間がつまる
- 【結論】NN,IE共通のレイアウトを作成不可能。暫定措置としてIEでなるべく細かくテーブルを分割してセル内に正確に段組をする。個々のセルでは頭だしされるので両ブラウザの差が大きく見えない(NNで大きな余白ができない)。
背景画像のカレントディレクトリ
- スタイルシートで　background-image: url("****.***");
  句を使用して背景画像を設定する場合の画像ファイルのカレントディレクトリは
- IE　スタイルシートのあるディレクトリ
- NN　HTMLのあるディレクトリ
- つまりスタイルシートとHTMLが別のディレクトリの場合､どちらかのブラウザでファイルを読み込めない。
  例　<LINK rel="stylesheet" href="../kkk.css" type="text/css">
- 【対策】スタイルシート、HTML両方のディレクトリに同じ画像をおく。
- 【結論】背景画像にスタイルシートは避ける。画像の縦・横方向への繰り返しを正確に指定したい時のみ使用する(HTMLでは設定オプションがないので)

画像と文字の縦の位置関係(画像のある行が次のテキスト行と重なる)
- NNでは画像とテキストの縦の位置関係がうまく表示されない。段落はじめ等に画像でマーカーを設定するようなケースで発生する。
- 具体的事象は画像が次のテキスト行まで食い込んでしまい、それにつられて後続の文字も次行と重なってしまう。
- 【対策1】段落マーカー等はテキストと同じ高さの画像にする。
- 【対策2】それでも次行と少し重なってしまう時はIMGタグにalign="top"を設定する。
- 対策2詳細:IMGタグのalign句のデフォルトはNNもIEも"middle"だがNNでは画像とテキストの位置関係が少しずれており､画像が下の行へ食い込んでしまう。align="top"を設定すると NNでちょうどセンターになる。IEでは画像が上になってしまうが､対策1でテキストと画像の高さがあっていればさほどの違和感はない。
ウィンドウの横サイズを越える画像の表示(フレーム使用時)
- NNはフレーム使用時、ウィンドウの横のサイズを越える大きな画像の表示ができない。(上の方だけ表示されるだけ)
- 【対策】画像と同じサイズのテーブルを定義し、<TD><IMG>にwidth,heightを指定する