2011-07-22 16 views
0

私は3列のテーブルレイアウトを持ち、中央の列はposition:relativeです。3つの列レイアウト、固定と相対配置CSS

中央の柱の中に私は位置にする必要があるフォームを持っています。 (まあ、別の方法がない限り)

私が必要とするのは、ブラウザが広がるときに液体の幅を持つフォームですが、ページの下部に貼り付ける必要もあります。ですから、私がposition:fixedを使うと、それは下部にとどまっていますが、右側のサイドバーと重なっています。私がposition:relativeを使うと、それはサイドバーの間にとどまるべきですが、それはページと共にスクロールします。

少しjsfiddleを作成しましたが、固定配置は表示されません。しかし、私のコードを見ることができます。 http://jsfiddle.net/winchendonsprings/S5zkm/1/

ここでは、右側のサイドバーと重なっていることがわかります。 http://i.imgur.com/awp07.png

答えて

2
#center { 
    padding: 0 15px; 
    background-color: green; 
    position:relative; 
} 
div.main { 
    position:absolute; 
    bottom:0px; 
    left:0px; 
    right:0px; 
} 

あなたはその(相対的な位置の親の中に絶対位置)を試すことができます。 上下の値を使用して再生し、垂直に配置します。 (ウィンドウの横方向のサイズを変更する必要があります)。 それはあなたが欲しいものですか?

+0

はい、ただし、ページの残りの部分をスクロールして下部に固執している必要があります。 – winchendonsprings

+0

試してみてください: div.main { 位置:固定; \t下段:0px; \t左:150ピクセル; \t右:150ピクセル; } 左と右のプロパティを使用してバーと左の列からの間隔を調整します – Riskz

+0

ありがとう!作品! 。 – winchendonsprings