WEB相談室

Webページ作成に関しての何でも掲示板です。

タイトル:ボックス領域の配置(縦)

0:[投稿] sheep [2002/08/11 01:44 ][環境:わからない わからない]

ブラウザのサイズを ドラック等で 変えたとしても
常にブラウザ上の 縦横共に中央に
ボックス領域を 配置するには どうしたら 良いでしょうか??

現状は 表(テーブル) を w100% : h100% にして
その中に 700x500 の ボックス領域を 置いています。

Netscape Navigator 6 では どうにか 縦横共に 中央配置に 出来たのですが
Internet Explorer 6 では 横中央 縦上 に なってしまいます。
(Internet Explorer 5.5 の時は 出来てた気がします。)

表を 使わなくても 良いです。
このボックス領域の中には さらに ボックス領域が いくつか あります。

伝わらなかったら すいません。
よろしくお願いします。


1:[お知らせ] sheep [2002/08/11 03:22 ]

自分でも 試してみてるのですが… どうにも 解りません。

スタイルシートに 下記が あります。
table{
border:0pt; border-spacing:0pt; border-collapse:collapse; }
table.s
{ width:100%; height:100%; }
td.s
{ text-align:center; vertical-align:middle; padding:0pt; }

HTML に 下記があります。
<body><table class=s><tr><td class=s>
aaa
</table></body>

上記の場合
NN6 では ブラウザ上 縦横 ともに 共へ
IE6 では ブラウザ上 縦上 横中央 へ
aaa と 表示されます。

IE で ブラウザ上 縦横共に中央へ 表示されるには
どうしたら良いのでしょうか??

IE と NN の スタイルシート を 作っても 良いので
どちらからでも 中央に 表示されるようにしたいです。


2:[お知らせ] sheep [2002/08/11 03:23 ]

訂正…

上記の場合
NN6 では ブラウザ上 縦横 共に 中央へ
IE6 では ブラウザ上 縦上 横中央 へ

です。 すいません。


3:[回答] 2m [URL] [2002/08/11 14:49 ]

これじゃダメですか?
違っていたらごめんなさい。

<HTML>
<HEAD></HEAD>
<BODY>
<TABLE width="100%" height="100%">
<TR>
<TD align="center" valign="middle">
<!--ここから↓-->

(ここに中身を記入)

<!--ここまで↑-->
</TD>
</TR>
</TABLE>
</BODY>
</HTML>


4:[完了] sheep [2002/08/11 16:34 ]

2m 様 ご回答 ありがとうございます。
下記の方法で 解決しました。

<!doctype html public '-//w3cdtd html 4.01 transitional//en'
'http://www.w3.org/TR/html4/loose.dtd'>

これ 取ったら 上手く表示されました…。
何ででしょう…???

今 全て 小文字で 書きましたが
大文字で 書く場所は 大文字で 書きました。

っしっかし 付けたら 駄目なんですかねぇ??

一応 完了に しますが…
全く納得 行きません。


5:[完了] 謎の素浪人 [2002/08/11 19:14 ]

> <!doctype html public '-//w3cdtd html 4.01 transitional//en'
> 'http://www.w3.org/TR/html4/loose.dtd'>
> これ 取ったら 上手く表示されました…。
> 何ででしょう…???

MacIE5以上、WinIE6以上、Netscape6,7/Mozilla などは、
文書型宣言の有無によって整形解析が変化します。

文書型宣言が記述されている場合は「標準準拠モード」、
記述されていない場合は「互換モード」になります。

http://www.microsoft.com/japan/developer/articles/dnie60/html/cssenhancements.asp
http://www.remus.dti.ne.jp/~a-satomi/bunsyorou/Doctype-Switch_situation.html
http://www.remus.dti.ne.jp/~a-satomi/bunsyorou/Doctype-Switch_example.html

本来、table要素に height属性はありません。ブラウザの独自拡張です。
CSS1 では、heightプロパティにパーセント定義はありません。
CSS2 の heightプロパティのパーセント定義は以下のようになっています。

> コンテナブロックの高さが明示されておらず、
> 内容領域の高さに依存していれば、'auto'として解釈する。

過去ログにも同じような質問があります。
http://www.ybi.co.jp/koike/qa1000/qa1375.htm


6:[完了] yuu [MAIL] [URL] [2002/08/11 23:30 ]

>文書型宣言が記述されている場合は「標準準拠モード」、
>記述されていない場合は「互換モード」になります。

HTML 4.01 Transitional の場合は、SYSTEM識別子の有無で切り替わります。

回答(必須): 状態:

お名前(必須):

e-mail:

URL:




[戻る]

ChaichanPAPA's World