2011-12-21 46 views
2

3つのフローティングディビジョンをページの中央に配置するにはどうすればよいですか?divの内側にdivを配置しますか?

<div style="width:100%"> 
    <div style="width:90%"> 
      <div style="width:80%"> 
       //Content 
      </div> 
    </div> 
</div> 
+0

可能複製[DIVにDIVを中央にどのように?](http://stackoverflow.com/questions/114543/how-to-center-div-in-div) – ChrisR

+0

ここでは2つの簡単な方法には、 (純粋なCSSの)div内のdivの中心div:http://stackoverflow.com/a/31977476/3597276 –

答えて

12

使用margin: autoでそれを中央にすることができます。

<div style="background-color: red; height: 100px; width: 500px; margin: auto;"> 
    <div style="background-color: green; height: 100px; width: 300px; margin: auto;"> 
      <div style="background-color: blue; height: 100px; width: 100px; margin: auto;"> 
       //Content 
      </div> 
    </div> 
</div> 
+0

ありがとうございますが、私のdivのパーセンテージは100%、80%、50%のような幅です。 –

+1

ピクセル幅をパーセント値に変更するだけで、それでも機能します。私のコードで重要なのは 'margin:auto'です。 – socha23

+0

ありがとう、私はそれを働かせた。 –

3

あなたが中心にしている要素は、指定された幅を持っている場合は、CSSでmargin: 0 auto

関連する問題