ネットスケープ 4.xはCSSを実装しているものの、その実装に大きな問題があります。実装が完全な独自仕様と言うのならまだ許せますが、その独自仕様さえも守れない有り様です。正直言って欠陥商品以外の何物でもありません。
こんなブラウザなので、ネットスケープ 4.xでのCSSの利用は諦めた方がいいのですが、今以って結構な数のユーザが残っており、CSSを使わないプレーンなページを見せるのに躊躇している方もいると思います。
ここでは、製作者が知る限りのネットスケープ 4.xでの問題点を簡単に挙げてみたいと思います。
ネットスケープ 4.xにおいては、JAVAスクリプトとの併用に注意が必要です
ネットスケープ 4.xには、4.0xと4.5以降の二系統があります。4.0x系統はCSSの処理が4.5以降以上に不正確なだけでなく、ボーダ系プロパティを用いた場合はHTML文書のマークアップによってはクラッシュする事もあります。ですから、ネットスケープ 4.0xではボーダ系プロパティは絶対に使わないようにして下さい。
個人的にはお奨めしませんが、HTML文書側でネットスケープ 4.xが認識しない要素は使わないと言う方法もあります。具体的にはインライン要素では<q>要素，<dfn>要素，<acronym>要素及び<abbr>要素, <ins>要素及び<del>要素などを用いない事です。
ネットスケープ 4.xでは、CSSの原理からして、本来あるべき姿から離れています。
CSSには、ブラウザのスタイル機能をウェブ制作者などが自由に再定義出来るようにするためのものと言う一面があります。
しかるにネットスケープ 4.xの場合は、予めブラウザに設定されたスタイルを後からCSSで修正すると言うやり方を採っているようなのです。
スタイルの修正は、JAVAスクリプトを拡張したJAVAスクリプトスタイルシート(JSS)によって実現されます。
CSSで記述した場合は、CSSでのプロパティ定義をJSSに変換して処理します。
CSSからJSSへの変換機能にバグがあるのか、JSS自体にバグがあるのか…その答えは恐らく両方でしょう。
通常、ブロックレヴェル要素のmarginプロパティで値を「0」とした場合、隣接する要素に接すると言うのが正しい解釈です。
しかし、ネットスケープ 4.xでは、予めデフォルトスタイルでの上余白幅を取った状態を「0」としています。
従って、例えば<p>要素(デフォルトスタイルは上に一文字分の余白が入る)で「line-height: 1.2em」としている場合、他のCSS対応ブラウザでの「margin-top: 0;」を実現するにはネットスケープ 4.xでは「margin-top: -1.2em」としないといけません(実際にはこれでも正常に表示されない事も珍しくありません)。
また、<blockquote>要素やリスト要素群など、左右の余白を取る要素に関しては、左右のマージンも同様に予め決められた値が加算される事となります。
ある要素の上マージン幅に負値を与えた場合、その上に配置されているテキストが消えてしまったり、アンカーが機能しなくなる事があります。ちょうどマージンがテキストの上に覆い被さってしまうような感じになってしまうのです。
通常、ブロックレヴェルは横幅やマージン等を指定しない限り、幅は100%と見なします。背景色やボーダも当然幅いっぱいに描かれる事になります。
しかし、ネットスケープ 4.xではブロックレヴェルの幅は文字のある範囲となります。背景色は文字のあるところのみ表示され、ボーダも文字の範囲にしか及びません(折返しで右端いっぱいまで文字があればいいのですが、折返し点が右端に無い場合はその分幅が狭くなります)。
この対策としては、当該ブロックレヴェル要素には必ずmarginプロパティとborderプロパティを当てると言うのがあります。これらのプロパティは意味の無い値でも構いません。すなわち「margin: 0;」「border: none;」でも構いません。とにかくこの二つのプロパティを当てる事で、背景色やボーダが幅いっぱいに描かれる事になります。
また、body要素などの上位要素にtext-alignプロパティで配置を指定すると、ブロックレヴェル要素も影響を受けます。
つまり、以下のように記述すると、<body>要素の下位にあるブロックレヴェル要素もセンタリングされてしまうのです。
body { text-align: center; }ネットスケープ 4.xではスタイルが適用出来ない要素があります。
<img>要素ではfloatプロパティは使えますが、ボックス関連のプロパティは一切使えません。
リスト要素群でリストアイテムを表わす<li>要素，<dt>要素及び<dd>要素にline-heightプロパティ及びmarginプロパティ群以外のスタイルを当てる事は出来ません(機能しないどころか不正な表示やクラッシュの原因にもなります)。
但し、<ul>要素，<ol>要素及び<dl>要素にはスタイルを当てる事が出来ますので、文字の色を変えるなどしたい時はこれらの要素に必要な値を当てる事になります。とは言うものの、<dl>要素に関しては<dt>要素と<dd>要素の二つがある為、それぞれのスタイルを別々に定める事は難しいと言う事になります。
表に関しては、原則的に<th>要素と<td>要素での指定が有効です。<tr>要素や<table>要素での指定は継承されない場合があります。
枠線に関する指定は一切使えません。
<pre>要素にいろいろプロパティを当てると、整形済みテキストとしての表示(半角空白や改行をそのまま反映させるなど)が行われなくなります。
つまり、勝手にプロパティが書き換えられてしまう事があります。
対策としては、スタイル定義の一番最後に「white-space: pre;」プロパティを当てる事で解決します。
プロパティが勝手に書き換えられてしまう現象は、他の要素やプロパティにもあるようです。
ネットスケープ 4.xではプロパティの組合わせでおかしくなる事があります。また特定のプロパティに問題があります。
line-heightプロパティにも問題があります。
省略されていると、そこでの処理がいい加減になってしまいます。
取り敢えず、以下のプロパティは要注意です。利用する場合は充分な表示の確認と細かな調整が必要になります。ネットスケープ 4.xで表示確認が出来ない環境の方は、これらのプロパティを使うのは避けましょう。
デフォルトで固有のスタイルを持つ要素は上位要素のスタイル定義を継承しません。従って上位要素からの継承を当てにせずに指定したい要素に直接適切なスタイルを当てるようにして下さい。
float: left;」、右側には「float: right;」をそれぞれ用います。詳しくはフローティングの応用例１・段組を実現するをご覧下さい。ネットスケープ 4.xでは、「JAVAスクリプトを用いて」且つ「そのスクリプトが改行文字を書出している」場合、読み込んだHTML文書の途中で勝手に改行を入れてしてしまいます。この改行が偶然タグの途中に入ると、そのタグは正常に認識出来なくなり、結果表示の崩れに繋がります。しかも厄介なのは、この改行の挿入される位置が環境によって前後する事です。
CSSを使う使わないに拘らず、JAVAスクリプトを用いている限りこの問題は避けられません。実際、この欠陥によってアンカーが機能しないとか画像が表示出来ない等の問題がしばしば起こります。しかし、CSSで複雑なデザインをするとタグのエラーがそのままスタイルに影響して見るに堪えないページとなる可能性があります。
ですから、JAVAスクリプトを組む場合は絶対に改行文字を書出さないようにして下さい。特に複数のスクリプトを併用する場合は全てのスクリプトが改行文字を書出さない事を確かめて下さい。
<noscript>要素の直後からマージンが無効になってしまいます。
このため、以下のように表(テーブル)の内部に<noscript>要素を収めます。
こうすると、スタイルの崩れが表(テーブル)内部で収まって外部には影響が出なくなります。
<srcipt type="text/javascript" src="○○.js"></script><table border="0"><tr><td><noscript>(スクリプトが実行出来ない場合の代替コンテンツ(ブロックレヴェル要素))</noscript></td></tr></table>
この他の対処法としては、<noscript>要素を利用しないで済むような仕掛けにすると言うものもあります。
例えば画像を切替えるスクリプトを用いるのであれば、予めスクリプトが利用出来ない場合に表示させるデフォルトの画像を普通に<img>要素で埋め込んで、それを切替えるスクリプトを実行するようにすればいいでしょう。
document.images[○]オブジェクトを操作します。画像切替のスクリプトは函数の形で記述して<head>要素内でリンクして、実際の函数の起動は<body>要素開始タグ内に「onload="函数名();"」属性を入れておけば良いでしょう。もう一度言います。ネットスケープ 4.xは言い訳出来ない欠陥商品です。
