レイヤー・・・ブラウザが古いとぐちゃぐちゃになります

Question

テーブルでどうしてもうまく表現できない箇所だけをレイヤーにしてサイトデザインを完成させました。
うっかりIE6でしか確認していなかったので、しまったと思い、すぐに以下のブラウザを使用して見栄えを確認してみました。
その結果も合わせて以下に記します。

windows/IE6    問題なし
windows/Netscape7.1　問題なし
windows/Netscape4.7　レイヤー使用箇所だけずれる
windows/Opera7.1　　問題なし

Mac/IE5　　レイヤーの部分だけが表示されて、その下部にページ全体が表示されます。このIE5のずれが一番ひどかったかもしれません。

レイヤーを使い方がまずいのでしょうか。それともブラウザの使用上、これは仕方がないことなのでしょうか。

ちなみにDreamweverMXによる作成です。
レイヤーは凄く便利ですが、それだけ扱いが難しいのだなと痛感いたしました。

mat-21 · Accepted Answer

Netscape Navigator4.7のスタイルシートは、バグが多いため、私の場合は、無視しています。というか、Netscape6～があるため、ver4.7のブラウザは無視しています。ってことを踏まえて、回答します。私の場合、ウェブデザインは全てスタイルシートを活用し、デザインもレイヤー（この場合のレイヤーとは、

の事）をふんだんに使用しています。今のところ、WindowsでもMacintoshでも問題なく同じように表示されています。強いていうなら、WindowsIE6から導入されたセンタリングのスタイル

は、WindowsIE5以前では、反映されません。よって、レイヤーを使ったデザインで、ブラウザの表示で全体をセンタリングする設定は、可能です（JavaScriptを使用しなくても）が、ちょっと、コツが必要です。 >Mac/IE5　　レイヤーの部分だけが表示されて、その下部にページ全体が表示されます。 WindowsIE6では問題ないのに、Macintoshでは、問題があるのは、スタイルシートの指定に何か不適切な指定があるものと思います。是非一度、WindowsIE5で見てみてください。Macintoshの表示と同じような現象が起きているかもしれません。（←経験者^^;）問題としては、positionは、absoluteになっていますか？そのレイヤーのwidth指定は正しいですか？left, top, width, heightなど、ピクセル数値で指定されてますか？数値は、100pxといったピクセル数か%値でしか指定できません。Dreamwaverを使用しているので大丈夫だと思うのですが、また、レイヤーが入れ子になっている場合は、親もまた、レイヤーになっていることが必須です。この場合のレイヤーとは、スタイルでposition指定が、absoluteもしくは、relativeの指定になっていなければなりません。いくら、親が

になっていても、レイヤー指定（absoluteかrelative）がなっていなければ、そのさらに上の親になります。もし、その上がなら、親はになります。確かにはレイヤー指定されていないですが、全てのレイヤー（absoluteの場合）はに準じるので、入れ子になっていても、親がレイヤーでなければ、に対してのレイヤー位置になります。あと、DreamwaverMXは、バージョンアップしましましたか。確か今は6.1だったと思います。6の時のレイヤー指定にバグがあったみたいですよ。(もっとも、ブラウザでのプレビューは問題ないですけど....)

jakarta · Answer

Netscape Navigator4.7のスタイルシートは、バグちゅうよりも実装の不備ですね。ウインドウ内の全ての要素がレイヤーにより絶対的に配置されていないと表示位置がずれます。特殊な事情がないかぎりは切り捨ててかまわないと思います。

>なぜかレイヤーが飛び出して上部に表示されて、そのあとに、テーブルがきます。 

私の場合Mac版IE5/ネスケ4.7で確認しながら作りますんで逆にMac版IE5で表示がおかしいというのがピンときません。ためしにレイヤー指定のサンプルを用いてMac版IE5.1.6で確認しまたがそのような異常はありませんでした。
htmlソースの全体像がわかれば具体的な問題点はわかるかもしれません。

レイヤー・・・ブラウザが古いとぐちゃぐちゃになります

Netscape Navigator4.7のスタイルシートは、バグが多いため、私の場合は、無視しています。

Netscape Navigator4.7のスタイルシートは、バグちゅうよりも実装の不備ですね。

関連するカテゴリからQ&Aを探す

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング