※ ChatGPTを利用し、要約された質問です(原文:Safariでheight:100%のボックスを表示したいのです)
Safariでheight:100%のボックスを表示したいのです
このQ&Aのポイント
Safariでheight:100%のボックスを表示する方法について
他のブラウザでは成功したが、Safariではうまくいかない理由
CSSとHTMLのコードの一部を示し、解決策を探す
Safariでheight:100%のボックスを表示したいのです
Safariでheight:100%のボックスを表示したいのです。MacIE・WinIE・FireFox・Operaでは出来たのですが、どうしてもSafariだけheight:100%のボックスが出来上がらず・・・。
以下、記述したCSSとHTMLです。
HTML---------
<body>
<div id="main">
<h1>height100%のボックス</h1>
<p>
標準準拠のIEやfirefoxでbody直下にheight100%のボックス
</p>
・・・略 <h1>height100%のボックス</h1>
<p>
標準準拠のIEやfirefoxでbody直下にheight100%のボックス
</p>
・・・略
</div>
</body>
</html>
CSS---
/* \*/
html{
height:100%;
}
/* \*/
body{
height:100%;
width:80%;
margin:0px auto;
padding:0px;
}
div#main{
background-image:url(../images/contents_bg.gif);
border:solid 1px #760014;
border-width:0px 1px;
height:100%;
min-height: 100%;
margin:0px auto;
padding:0px;
border:1px solid #ff0000;
}
body > #main{
height: auto;
}
h1{
margin:0px auto;
padding:0
お礼
お礼が遅くなり申し訳ございません。ご回答ありがとうございました。 min-heightは、Operaの為、body > #mainはFirefoxの為必要としております。IEやSarafiのためのものではございません(Operaに関しては特にどうでもいいのですが、念のため程度で・・・・)。 ちなみに、body > #mainを削除してしまうと、Firefoxでレイアウトがくずれしまいますのでこれはこれで必要としております。 また、Safariのバージョンは最新を使っております。