掲示板/総合質問板/過去ログ/一覧/ テーブルの上に画像を重ねたいのですが

0 名前：栗原： 2006/02/06 23:05: はじめまして、栗原と申します

文字を表示しているテーブルの上に画像を重ねたページを作ろうとしています。
画像はバナーのようなものを斜めにした画像です。
ネットで色々調べながらここまで作ったのですが、どうしても画像がテーブルの後ろになってしまいます。
おかしな部分などあれば教えて下さい。

よろしくお願いします。

CSS（外部ファイル）
img.z {position: relateive; z-index: 2;}
div.z {text-align: center; position: absolute; top: 70px; left: 115px; z-index: 1;}
.A{width: 900px; height: 400px; background-repeat: no-repeat; background-position: top left;}
.B{background-image: url("../picture/5haikei.png"); font-size: 40pt; font-weight : bold; text-align: center; width: 730px; height: 320px; color: #FFFFFF;}
.C{background-color : #FF0000; border-width : 10px; border-color : #c794FF; border-style : ridge; font-size: 40pt; font-weight : bold; text-align: center;width: 650px; height: 260px; color: #FFFFFF;}

HTMLソース
<table class="A">
<tr><td><img src="picture/cousion.gif" class="z">
<div class="z">
<table class="B">
<tr><td>
<table class="C">
<tr><td>あなたは誰ですか？</td></tr>
</table>
</td></tr>
</table>
</div>
</td></tr>
</table>

2 名前： とおりすがり ： 2006/02/06 23:05: ×　img.z {position: relateive; z-index: 2;}
○　img.z {position: relative; z-index: 2;}

3 名前：栗原： 2006/02/06 23:05: できました
relateiveはスペルミスでした。
これの修正と、ソースを以下のようにすることでできました。

HTMLソース
<div class="z">
<table class="B">
<tr><td>
<table class="C">
<tr><td>あなたは誰ですか？</td></tr>
</table>
</td></tr>
</table>
</div>

<img src="picture/cousion.gif" class="z">

なぜこうしないとダメなのかは理解できていませんが、実現は出来ました。
どなたか技術的な条件など教えていただける方がいれば、なぜこうしないとダメなのか教えていただけるとうれしいです。

よろしくお願いします。

5 名前： HG ： 2006/02/06 23:05: いろいろツッコミ所があるが、まずはInternet Explorer以外のブラウザで
確認してみることをおススメする。
たぶん「意図する表示」にはなっていないと思う。

6 名前：栗原： 2006/02/06 23:05: そうですか私の勘違いだったんですね
ありがとうございました。

また調べてみたところ、z-index無しでも画像を重ねることが
できたので、z-indexは使わないことにしました。

いろいろあるというツッコミ所ですが、よかったら教えていただけますか？
よろしくお願いします。

7 名前： S ： 2006/02/06 23:05: 　たとえば、テーブルを入れ子にまでしてる理由とか。データだけみれば１つのみにして、それにスタイルを設定すれば間に合うようなきがする。

　まあ、まずは基礎から。

http://members.jcom.home.ne.jp/pctips/www/introduction.html