html - ブートストラップ流動レイアウトのスクロール可能なサイドバー

Question

これについて助けが必要です。ブートストラップの流動レイアウトを使用してサイドバーとコンテンツ div を作成したいのですが、サイドバーをスクロール可能にし、コンテンツ div をスクロール可能にすることはできません。私はすでにoverflow:hidden;を使ってみました。body に適用し、overflow:auto をサイドバーの div に適用しますが、機能しません。何が欠けていますか? 私のscssコードは次のとおりです。

  #main-container{
       margin-left:0;
       margin-top:60px;
       padding:0px;
   .span3{
        background-color:white;
        ul{
        margin: 0;

        li#song{
            background-image: url($images+'chevron.png');
            background-position: right center;
            background-repeat: no-repeat;
            background-color:white;
            color: #666;
            border-top: 1px solid #B4B4B4;
            list-style-type: none;
            padding: 10px 10px 10px 10px;
             }
           }
         }
       }

    .maxheight{
     height:100%;
    }

    .no-overflow{
   overflow-y:hidden;
     }

   .scrollable{
   height:100%;
   overflow-x:hidden;
    }

これがサンプルコードです。左のdivはスクロールしたいものです: http://jsfiddle.net/xYDRg/