HTMLとCSSの指定についてご存知の方教えてください。
トップページのコンテンツ全体をひとつの大きなdivで包み、それに対してCSSで
margin:0px auto 0px auto;
を指定して、「常に左右センターで表示する」設定にしていました。
そのdivには
width:1000px;height:630px;
で、天地左右のサイズ指定をしています。
そうしたらお客から「天地方向もセンター表示にできませんか?」といわれ
何でも「できるらしい」という話だけがあり、自分でも調べてみたのですが、以下のようなコードしか見つかりませんでした。
●HTML <div id="floater"><div id="content">Content here</div></div>
●CSS #floater {float:left; height:50%; margin-bottom:-120px;} #content {clear:both; height:240px; position:relative;}
別のファイルを作ったら再現はされましたが、これだと「左フロート」とか、「高さを％指定」とか
自分のサイトでは適用できない指定があり、かといって他にいいテクニックも見つからず、困っています。
・divを左右センター表示 ・divの天地左右のサイズはピクセルで指定
これを守ったままで、天地方向にもセンター表示をさせたいということなんです。
何かご存知の方は教えてください。よろしくお願いいたします。
ベストアンサー
-
nao_iwashima
満足200pt
自分はいつも下記のような書き方をしていますが、いかがでしょう？
(#余談ですが、天地630pxは縦スクロールが出る環境のユーザーもいるような気がします…)
#hoge { width: 1000px; height: 630px; position: absolute; top: 50%; left: 50%; margin-top: -315px; margin-left: -500px; } <div id="hoge"> <p>hoge</p> </div>-
hirapi
-
hirapiその他の回答
-
sk_kls
満足20pt
http://www.webbibo.com/stylesheet/layout/vertical.html
こちらのサイトを参考にしてます。
<html> <head> <style type="text/css"><!-- div {width:1000px; height:630px;} div.wrap div {display: table-cell; vertical-align: middle;} div.wrap div.box1 {background-color: #FFDDDD;} --></style> </head> <body> <div class="wrap"> <div class="box1"> ボックス1<br> ボックス1<br> ボックス1<br> ボックス1<br> ボックス1 </div><br> <div class="box2"> ボックス2<br> ボックス2 </div> <br><br> <p>テスト</p> </body> </html>
うまく出来なかったらスミマセン。
ちなみにIEに対応させるためにはさらに必要な記述があるみたいですので、その場合はサイトを参考にどうぞ～
-
hirapi
-
- その他の回答を読む
この質問へのコメント
質問の情報
- 登録日時
- 2009-08-06 11:25:13
- 終了日時
- 2009-08-06 17:17:17
- 回答条件
- 1人5回まで
この質問のカテゴリ
この質問に含まれるキーワード
人気の質問
-
ログインしなくて良い質問サイト教えて下さい
山田生活
1
1
-
クラシックのライブ録音で雑音が入っているcd教えて下さい(回答がなかった場合 再投稿します）…山田生活
-
小中時代から自分の考えを持ち現実にあらわしていける。自己主張ができる人というのはそんなにいないかと思…
寺本まこと21
-
超能力、霊能力がある人に質問です。思考がテレパシーのように伝わることがあるかと思います。このことをサ…寺本まこと
-
平成18年に父親が個人である知人から金銭を借りる際に実家の不動産に対して根抵当権を設定しました。父親に…
okutarou1