ComboBox ListItems Not OnTop - So Missing a Few

Hello All:

I have a feeling there is something I need to do with my css, but I am not sure where and I haven't found a solution yet online. 

But what is happening is that I am populating an AJAX:ComboBox on our page.  The data loads without a problem, but when I click the arrow to see the listitems, only the first two of more than 16 are showing. 

What I believe is happening is that the list is not going "on top" of the item below it, so it is getting cut off.  I am not sure how to make sure the ComboBox is always showing the entire list, regardless of the objects on the page below it. 

I hope this makes sense as I am unable to upload a screenshot of the issue. 

.CustomComboBoxStyle table
{
    margin-bottom: 3px!important;
    top: 0px!important;
    position: relative;
}
.CustomComboBoxStyle
{
    position: relative;
}
.CustomComboBoxStyle ul
{
    position: absolute ! important;
    left: 2px ! important;
    font-family: Arial, Helvetica, Sans-Serif;
    font-size: 10pt;
    color: #ffffff;
    background-color: #9C9C77;
    border: 1px solid black;
}
.CustomComboBoxStyle .ajax__combobox_itemlist
{
    overflow-y: auto !important;
}
.ajax__combobox_itemlist
{
    overflow-y: auto !important;
}
/* Firefox Fix */
@-moz-document url-prefix()
{
    .CustomComboBoxStyle ul
    {
        top:22px ! important;
    }
}
/* IE 8 + 9 Fix */
.CustomComboBoxStyle ul
{
    top:10px \0/ !important;
}

<ajaxToolkit:ComboBox 
     ID="cbFiscalAccount" 
     CssClass="CustomComboBoxStyle" 
     AutoCompleteMode="Suggest"
     OnSelectedIndexChanged="cbFiscalAccount_SelectedIndexChanged" 
     AutoPostBack="true" 
     runat="server"></ajaxToolkit:ComboBox>