CSS Column Divsヘルプが必要

Question

私はページレイアウトを作成しようとしていますが、左側の列の幅と高さは100％（右の列が何であれ）で、右の列は流体幅です。誰か場合

body { 
    height: 100%; 
} 
div#pageHolder { 

} 
div#topSection { 
    padding: 0px 0px 0px 0px; 
    margin: 0px 0px 0px 0px; 
} 
div#pageContainer { 
    position: relative; 
    width: 100%; 
    height: 100%; 
    padding: 0px 0px 0px 0px; 
    margin: 0px 0px 0px 0px; 
} 
div#leftColumn { 
    position: relative; 
    float: left; 
    width: 285px; 
    height: 100%; 
    padding: 0px 0px 0px 0px; 
    margin: 0px 0px 0px 0px; 
} 
div#leftHolder { 
    padding: 25px 25px 25px 25px; 
    margin: 0px 0px 0px 0px; 
} 
div#rightColumn { 
    position: relative; 
    height: 100%; 
    min-height: 100%; 
    padding: 0px 0px 0px 0px; 
    margin: 0px 0px 0px 285px; 
} 
div#rightHolder { 
    padding: 25px 25px 25px 25px; 
    margin: 0px 0px 0px 0px; 
} 
div#bottomSection { 
    clear: both; 
} 

：

<div id="pageHolder"> 
    <div id="topSection"> 
    header goes here 
    </div> 
    <div id="pageContainer"> 
    <div id="leftColumn"> 
     <div id="leftHolder"> 
     left stuff goes here 
     </div> 
    </div> 
    <div id="rightColumn"> 
     <div id="rightHolder"> 
     right stuff goes here 
     </div> 
    </div> 
    </div> 
    <div id="bottomSection"> 
    footer goes here 
    </div> 
</div> 

そして、私のCSSは次のとおりです。私はここで

は私のコードです...それを行うためのさまざまな方法を試してみたが、右のそれを得るように見えることはできません私を助けてくれるでしょう、それは素晴らしいでしょう:)

Answer 1

はこれを試してみてください：

div#leftColumn { 
    position: absolute; 
    float: left; 
    width: 285px; 
    height: 100%; 
    padding: 0px 0px 0px 0px; 
    margin: 0px 0px 0px 0px; 
} 

を**編集：相対：あなたがポジションを維持したい場合は、2番目の思想におそらくのmaxWidthとのmaxHeightを使用すると、あなたを助けるために何かをすることができます。

Answer 2

あなたのCSSでbodyの定義をbody, htmlに置き換え、高さをpageHolder

body, html { 
    height: 100%; 
} 
div#pageHolder { 
    height: 100%; 
} 

内部の内容に関係なく不要なスクロールバーが表示されるため、かなり迷惑です。これはあなたが達成しようとしていることですか？

Answer 3

http://css-tricks.com/the-perfect-fluid-width-layout/

i「はlive example」これはあなたが