1

簡単なはずのレイアウト設計に問題があります。私のメニュー(左側のサイドバー)のCSSトランジションが私がやっているようにめちゃくちゃになることを除いて、私は実際にそれを機能させています。

ヘッダーとフッターがあり、コンテンツ全体が中央に配置された 3 列の固定レイアウトが必要です。左と右の div は両方とも幅 220 ピクセル、高さ 100% で、スクロールできません (メニューは常に表示されます)。中央のコンテンツ div は幅 830px で、スクロール可能です。1270px を超えるモニター サイズでは、左右のボディにスペースが追加されます。

現在、次のようにコンテンツを配置して実行しています。

header{
position:fixed;
left:50%;
margin-left:-(width/2)px;
}

left{
position:fixed;
left:50%;
margin-left:-635px; <--(center width/2) - left width)
}

center{
position:relative;
left:50%;
margin-left:-415; <--center width/2
}

right{
position:fixed;
left:50%;
margin-left:415px;
}

繰り返しますが、これは css トランジションが Chrome でハングすることを除いて機能します。問題は、コンテンツを設定するための left/margin left メソッドです。その後、すべてが順調です。

float:left すべてを試してみましたが、ページ全体がスクロールしてしまい、望ましくありません。その左のバーを別の方法で中央の div の左に貼り付ける方法の手がかりはありますか?

4

0 に答える 0