- 締切済み
CSSスプライトの中央寄せ (CSS)
どうか力をお貸しください…。 dreamweaverでホームページを作成しています。 640pxの幅を指定した<div>の background-img に、CSSスプライトの中の幅600pxの画像を配置し、background-positionで、0 -100px; のように場所を指定しました。 その幅600pxの画像を640pxの<div>の中で中央寄せで配置したいのですが、どのようにすればいいでしょうか? padding:20px;は使うことができません。 ご存知の方がいたらよろしくお願いします。
- みんなの回答 (1)
- 専門家の回答
みんなの回答
- ORUKA1951
- ベストアンサー率45% (5062/11036)
HTMLさえ、ちゃんとしていたら迷うことないと思いますが??? スプライトを使うということは、背景画像ですから、たとえば、本文(section)内のナビゲーション(nav)の背景に使用するのでしたら、HTMLは <div class="section"> <div class="nav"> <ul> <li><a href=""></a></li> ・・・以下省略 でしたら、スタイルシートは div.section{width:640px;margin:0 auto;} div.section div nav ul,div.section div nav ul li{display:block;list-stylr:none;margin:0;padding:0;text-align:center;line-height:1.8em;} div.section div nav ul{width:600px;} div.section div nav ul li{width:100%;height:1.8em;position:relative;} div.section div nav ul li+li{margin-top:5px;} div.section div.nav ul li a{display:block;width:100%;height:100%;background:url() no-repeat 0 -100px;} div.section div.nav ul li a:hover{background-position:0 -150px; div.section div nav ul li+li a{background-position:0 -200px;} とか・・・・