html - ページを中央に配置するにはどうすればよいですか？

Question

私のサイトには2つの部分があります。本体とサイドバー。本体は6インチで、サイドバーはおそらく200ピクセルになります。ページを中央に配置するにはどうすればよいですか？それで、左側と右側に等しいスペースがありますか？解像度に関係なく中央に配置する必要があります。

XHTML1.0Strictを使用します。すべての主要なブラウザ、または少なくともFirefoxとChromeで動作するはずです。

Answer 1

設定はどうですか

margin: 0px auto;

最も外側のコンテナに。

<div id="wrapper">
    <div id="side"></div>
    <div id="main"></div>
</div>

#wrapper { margin: 0 auto; width: 800px; }

Answer 2

左マージンと右マージンのマージンを自動に設定できます。

<div id="wrapper">
  <div id="sidebar"></div>
  <div id="main"></div>
</div>

#sidebar {
    float:left;
    width: 50px;
}
#main {
    width: 150px;
    float:left;
     background-color: yellow;
}
#wrapper {
  margin-left: auto;
  margin-right: auto;
  width: 200px;
}

これもかなり移植性があり、古いバージョンのIEでも機能します。

更新ラッパー、サイドバー、およびメインには幅が必要です。グーグルの2列のレイアウト、それはそれを行うためのかなり標準的な方法です。

http://jsfiddle.net/aXLVv/1/-実際の動作を確認してください。

Answer 3

私はマージン左とは思わない：自動; およびmargin-right：auto; 動作します。グローバルラッパーが必要です。

Answer 4

body {
    margin-left:  auto;
    margin-right: auto;
}