- ベストアンサー
スタイルシートの外枠について質問です。
- スタイルシートの外枠について質問です。外部ファイルに.container{background-color:white; position: absolute; left: 50%; width: 900px; height:1500px; ;border:8px; border-style:ridge;margin:30px 0px 100px -450px ;border-color:#00ff66}と記入、htmlに<link rel="stylesheet" href="（スタイルシートのURL）" type="text/css">と書きました。
- margin:30px 0px 100px -450pxで指定したように、ブラウザ上から30pxあけて外枠が表示され始めますが、外枠の下がブラウザにぴったりくっついてしまいます。
- 場合によっては外枠の下が見えなくなるようで、100pxあけての表示が上手くできません。どこが間違っているのか、教えていただけると大変助かります。
- neko984
- お礼率8% (4/45)
- ホームページ作成ソフト
- 回答数1
- ありがとう数11
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
＞場合によっては外枠の下が見えなくなるようで、100pxあけての表示が上手くできません。 というか、ウィンドウ幅が最も一般的な1024幅、720px高さでははみ出して見えない・・ .container{background-color:white; position: absolute; left: 50%; width: 900px; height:1500px; ;border:8px; border-style:ridge;margin:30px 0px 100px -450px ;border-color:#00ff66} ？？？の書き方も、なぜそうしているのかわかりませんが、簡略化プロパティをきちんと書きなおして同じプロパティを整理すると .container{ background-color:white; position: absolute; left: 50%; width: 900px; height:1500px; margin-top:30px; margin-right: 0px; margin-bottom: 100px; margin-left: -450px; } 絶対配置ですから、margin-right、margin-bottomは無効ないし、CSSで決めようがありません。 そもそも、staticであるbody直下にあるdiv.containerの意味が不明です。 body{ height:1630px; } .main{ background-color:white; margin-left: auto; margin-right:auto; margin-top:30px; width: 900px; height:1500px; } となるはずです。実際には色々なウィンドウサイズに合わせて、最大で900px、最小で600px、それ以外はウィンドウ幅の90%でセンター配置するのが良いでしょう。 【参考サイト】 ボックスモデル http://www.swlab.it.okayama-u.ac.jp/man/rec-css2/box.html#mpb-examples
お礼
とあるサイトでwidの幅に関係なくかならず中央に寄せることができるため、こんな記述になりました。 ＞絶対配置ですから、margin-right、margin-bottomは無効ないし、CSSで決めようがありません。 とあったので、最下部のmargin設定は諦めました。 うーむ、残念；