1

ウィンドウ/解像度が許せば横に並んだ2つのdivがあり、そうでない場合は上下に積み重ねられます。

どちらの場合も、それらを中心にする必要があります。どちらか一方のケースでそれらを中心に置くことができましたが、両方ではありませんでした。

レイアウト：

<div class="container">
   <div class="center">
      <div class="left">LEFT</div>
      <div class="right">RIGHT</div>
   </div>
</div>

CSS:

div.left {
    background:blue;
    height:200px;
    width:250px;
}
div.right {
    background:green;
    height:300px;
    width:250px;
}
div.center {
    text-align: left;

}
.container {
    text-align: center;
}
.container div {
    display: inline-block;   
}

ここで確認できます: http://jsfiddle.net/zygnz/1784/

この方法では、ウィンドウが横に並んだ要素よりも大きい限り中央に配置されますが、要素が重なっている場合は左に配置されます。

両方のケースの中心にするにはどうすればよいですか?

4

1 に答える 1

2

.centerクラスをtext-align: center次のように変更します。

div.center {
    text-align: center;
}
于 2013-05-13T03:39:38.850 に答える