■Netscape 4.xでレイアウトを崩れるのを防ぐには？ 2002年3月現在でNetscape 6.xが出ているのに、今更ながらNetscape 4.xネタです。Netscape 4.xでスタイルシートを使ってレイアウトされたページを閲覧した場合に、ある問題が発生します。正しくスタイルが反映されないのは仕方ないにしても、致命的にまずいのが「ウィンドウサイズを変更するとレイアウトが崩れてしまう」というものです。これは非常に有名なバグで解決方法も以前から示されています。その１つはJavaScriptを使って「location.reload()」などで再度ページを読み込むようにするというものです。 Adobe GoLiveなどの作成ソフトなども、このような方法を採用しています。単純に手軽だからです。もし、手軽でなくても良い、若干工夫すればよい、というのであれば以下の方法を検討してみてください。 ■レイアウトが崩れる３条件 Netscape 4.xでは、スタイルシート使用時の３条件を満たすとレイアウトが崩れます。その３条件を以下に示します。 (1) position:absoluteを使っている (2) top,leftを使っている (3) width,heightを使っている この３条件が成立しなければリサイズしてもレイアウトが崩れません。つまり「width,heightをtableタグで代用」してしまう、「position:relativeにする」（これは、実用的ではない）という方法を使えば回避できる事になります。複雑な入れ子になっている場合は、分かりませんが、多くはこのような方法で回避できるはずです。ただし、フォームは必ず最前面に表示されるのでフォームを使っている場合のレイアウト崩れは注意する必要があります。 ■実際のサンプル それでは、実際のサンプルで見てみましょう。以下はレイアウトが崩れてしまうタイプです。
赤字で示している部分が問題の部分です。ここではwidthをtableタグで代用する事によりレイアウト崩れを防いでみます。以下が書き換えたサンプルです。
このような方法を利用することでレイアウト崩れを回避することができます。 ■全てのNetscape 4.xでレイアウトが崩れるわけではない Netscape 4.xであれば、どうしてもレイアウトが崩れてしまう、という事はありません。レイアウトが崩れてしまうのはWindows版、Macintosh版でありUNIX版ではレイアウト崩れは発生しません。UNIXユーザー向けであればリサイズによるレイアウト崩れは気にしなくても良いという事になります。もちろんNetscape 6.xやMozillaでは、リサイズによるレイアウト崩れは発生しません。 Netscape 4.xは、すでに過去のものだし現在出回っているブラウザ、例えばInternet Explorerでは、そのような心配はありません。と言いたい所ですが、現実的にMac版のInternet Explorer 5.xでは、あるソフトを使ってページを作成するとスタイルシートによる問題が発生します。あるソフトというのは「IBM ホームページビルダー」です。致命的なのはリンクをクリックできない、というものでトップページでこれをやられるとMacユーザーでInternet Explorer 5を利用しているユーザーは以後のページを閲覧することができなくなります。これについては回避方法があり別ページにして、また説明したいと思います。 2001-2002 Copyright 古籏一浩/openspc@alpha.ocn.ne.jp |