CSSコミュのmac ie5.2,3とfirefox safariの違いについて。

すみません、初心者です。

mac IE 5.2,3とfirefox,safariの違いについて質問です。

コンテンツを常に上下左右中央表示にさせたいので、
某サイトに紹介されていた下記のやりかたで作ってみたのですが
firefox,safariでは、普通に中央表示されるのですが
IE 5.2,3ではコンテンツの上半分がブラウザの上部に隠れてしまいます。
システム識別子を消すとIEでもうまく表示されるのですが、css界でのセオリーとしてこの方法でいいのか不安です。

標準的に、このような問題はどのように解決されているのでしょうか。

お解りの方ご教授頂けないでしょうか。

.zenkei{
height:550px;
width:550px;
position:absolute;
top:50%;
left:50%;
margin-top:-275px;
margin-left:-275px;
}

コメント(4)

最初
全て
最新の40件

[1] mixiユーザー 09月11日 18:02

> システム識別子を消すと
比較的最近のブラウザの一部には(Mac IE5.x含む)，DOCTYPEスイッチと呼ばれる機構があります，特定の文書型宣言を含んでいると標準モードに，ないと互換モードになります．

丈がmarginを含まなくなるので，上にずれます．標準モードで実現したければ，marginを適切に設定してやればいいでしょう．

> 標準的に、このような問題はどのように解決されているのでしょうか。
table要素とcenter要素，あるいはtext-alignプロパティ．

[2] mixiユーザー 09月11日 18:26

すみません、え～っと。。

５５０px×５５０pxの正方形のページを作成しているのですが、それを上下左右中央表示にさせたいので、
「web工房きくちゃん」さんのサイトに紹介されていた
http://www.stylish-style.com/csstec/hi-level/domannaka.htmlのやりかたで作ってみたところ

firefox,safariでは、普通に中央表示されるのですが
IE 5.2,3では中央に配置されずに写真のように内容の上半分が
隠れてしまうんです。

こんな感じでどうでしょう。

[3] mixiユーザー 09月11日 20:48

> 隠れてしまうんです。
理由の大枠はさっきのコメントに書きましたが、MacIEのボックスモデルに関する本orサイトが手元に見当たらず、確認ができません。

安直な解決法としては、ブラウザ振り分け。例えば

.zenkei {
/* MacIE向けに適当にmargin変更 */
}
@media all{
.zenkei {
/* MacIE以外、もとのCSS */
}
}

でも全ブラウザに対応させつつ件のようなことをやるなら、Javascriptで画面サイズを拾う方がだいぶ簡単な気がしてきました。左右はともかく、上下というのがなかなか難儀です。

ちなみに、こんな議論がありました。expressionを使う提案や、display:tableを使うものもあります。
http://chaichan.hp.infoseek.co.jp/qa3500/qa3558.htm

[4] mixiユーザー 09月12日 10:23

>はっしーさん

どうもです。

＞ちなみに、こんな議論がありました。
できないんですね～。。

ログインすると、みんなのコメントがもっと見れるよ