Ajax ComboBox rendering incorrectly

I'm using the ComboBox from the AjaxControlToolkit v4.1.50731. When it displays on the page, the dropdown list renders well below the origin of the control. Unfortunately, I can't post an image due to SO restrictions.

I kept the code to a minimum on the page to avoid any possible conflicts:

    <AjaxToolKit:ComboBox ID="ComboBox1" runat="server">
        <asp:ListItem Text="Mild" Value="0" />
        <asp:ListItem Text="Medium" Value="1" />
  开发者_运维知识库      <asp:ListItem Text="Hot" Value="2" />
    </AjaxToolKit:ComboBox>

Any idea why this is happening or how it can be corrected?

The issue was caused by CSS styling but I couldn't isolate it the exact cause. To resolve the problem, I created a new page with no styling and only the combo box control, calling it "PlainComboBox.aspx". Then I used an iframe tag in the page where I wanted to display the combo box, as seen below:

        <iframe src="PlainComboBox.aspx" frameborder="0" height="130" >
           <p>Your browser does not support iframes.</p>
        </iframe>

This isolated the combo box from any styling issues elsewhere on the page and rendered correctly.