html - チェックボックス リスト項目の数を制限し、スクロールを追加する

Question

ドロップダウンリストを使用して動的に入力しているasp.netに2つのチェックボックスリストがあり、

現在は両方とも div にあり、1 つにはすべての果物の名前が含まれ、もう 1 つには特定のクレートに果物の名前のみが含まれています。

チェックボックス リストに多くのアイテムがある場合、div からオーバーフローします。修正する方法はありますか?

これはマークアップです

   <div class="list1">
        <asp:Label ID="Label3" runat="server" Text="Available fruits" />
        <asp:CheckBoxList ID="CheckBoxList1" runat="server" AutoPostBack="true" />
    </div>
    <div class="list2">
        <asp:Label ID="Label4" runat="server" Text="fruits in a crate" />
        <asp:CheckBoxList ID="CheckBoxList2" runat="server" AutoPostBack="true" />
    </div>

CSS

    .list1
    {
        clear: both; 
        float: left; 
        width: 290px;
        height: 190px;
overflow-y:scroll;
    }

    .list2
    {
        float:right;
        width: 290px;
        height: 190px;
overflow-y:scroll;
    }

アップデート

これをdivクラスに追加しようとしましoverflow-y:scroll;たoverflow:scroll; が、チェックボックスリストを別のdivに配置して上に追加しましたが、痛みだけではありません。