jquery - CSS を使用した全高の列?

Question

http://jsfiddle.net/ww7dN/

全体が 2 色 (左が緑、右が青) に「分割」されたページをデザインしようとしています。各セクションに列を配置したいと思います。最初の問題は、色がページ全体を埋め尽くしていないことです。2 つ目の問題は、ページのサイズを変更すると、水平スクロール バーが表示されないことです。

私は何を間違っていますか？または、この効果を達成するためのより良い方法はありますか?

これが CSS で複雑な場合は、jquery ソリューションを気にしません。ありがとう！

Answer 1

あなた#containerにはポジションがなかったので、その子供たちは誰が（の靴）を埋めるかを知りませんでした...

http://jsfiddle.net/ww7dN/1/

#container に追加してみてください:

#container {
  position:absolute;
  height:100%;width:100%;
  left:0;top:0;
}

---

2 番目の質問では、水平方向にスクロールするコンテナーに変更overflow:hiddenします。overflow:auto;

コメントから更新 追加してみてください

BODY {
  overflow-y:auto;
}

あなたbodyのCSSに

Answer 2

以下の CSS を次のように変更してみてください。

#public {
position: absolute;
width:100%;
height:100%;
color:#fff;
}
#public #container {
height:100%;
}

また、overflow: hidden はスクロールバーが表示されないようにします。

Answer 3

position:absolute to left div; を指定します。