[解決済み] 固定位置のdivがあり、コンテンツがあふれた場合、スクロールする必要がある。

質問

実は2つの問題があるのですが、もう1つの問題の方が対処しやすいと思うので、まず1つ目の問題を解決しましょう。

メニューのために、スクロールの左側に固定位置のdivを置いています。右側は標準の div で、適切にスクロールします。問題は、ブラウザのビューポートが小さすぎてメニュー全体が見えない場合、私が見つけたスクロールさせる方法はありません（少なくともCSSではありません）。cssでさまざまなオーバーフローを使用してみましたが、divをスクロールさせるものはありませんでした。メニューを含む div は min-height:100% と position:fixed に設定されています。

を含むdivは メニュー は、絶対位置と高さを 100% に設定した別のラッパーの div の中にあります。

コンテンツの高さがdivに対して高すぎる場合、どうすれば縦にスクロールするようになりますか？

それは、スクロールバーを表示させたくないという、もう一つの問題につながります。しかし、それに対する答えはすでに持っているかもしれません（ただ、そもそもdivをスクロールさせることができないので、まだうまくいっていません）。

何か解決策はありますか？もしかしてjavascriptが必要なのでしょうか？(私はほとんど知りませんが)

JSフィドルの例

と、問題を引き起こしている関連コード（ここに全部を掲載すると長すぎるため）。

.fixed-content {
    min-height:100%;
    position:fixed;
    overflow-y:scroll;
    overflow-x:hidden;
} 

また、試しにheight:100%も追加してみましたが、こちらもうまくいきませんでした。

解決するには？

を使用した場合の問題点 height:100% は、ウィンドウの100%ではなく、ページの100%になることです（おそらく期待通り）。これは、非固定コンテンツが、スクロールバーを必要とせずに100%の高さで固定コンテンツを含むのに十分な長さであるため、あなたが見ているような問題を引き起こすことになります。ブラウザは、そのバーをスクロールして表示することができないことを知らないし、気にもしません。

を使用することができます。 fixed を使えば、やろうとしていることが実現できます。

.fixed-content {
    top: 0;
    bottom:0;
    position:fixed;
    overflow-y:scroll;
    overflow-x:hidden;
}

あなたのフィドルのこのフォークは、私の修正を示しています。 http://jsfiddle.net/strider820/84AsW/1/