0

私はほぼ2日を費やし、これを行う方法がわかりません. ここにいくつかのコードがあります:

<div id='wrapper'>
  <div id='left'>
  </div
  <div id='middle'>
      <div id='centeredinmiddle'>
      </div>
  </div>
  <div id='right'>
  </div>
</div>

私が必要とするのは：ラッパーは垂直方向に中央に配置され、左右にズーム可能で、それぞれウィンドウ幅の20％、中央の静的幅：700px、centeredinmiddle-水平方向に中央に配置されます。

それが可能かどうかはわかりませんが、そうであることを願っています。

4

1 に答える 1

0

http://jsfiddle.net/cJqAu/

フローティング div の順序を変更します -->

<div id='wrapper'>
  <div id='left'>
      foo bar
  </div>
    <div id='right'>
    bar foo
  </div>
  <div id='middle'>
     <div id='centeredinmiddle'>
        lorem ipsum dolor sit amet and so on...
     </div>
  </div>
</div>

左右の div にいくつかの小さなスタイル ルールを追加します。

#wrapper
{
  width: 70%;
  margin-left: 15%;
  /*this is not a beautiful and nice attempt, but it works*/
}
#left
{
  float: left;
  width: 10%;
}
#right
{
 float: right;
 width: 10%;
}
#centeredinmiddle
{
  /*no need for further style rules if you nicely adjust the others ;)*/
}

ラッパーの幅を調整するだけです

于 2013-01-09T11:02:09.803 に答える