ASP.Net Ajax ComboBox en ModalPopup

Question

Tengo un cuadro combinado dentro de ModalPopupExtender y cuando se muestra la ventana emergente, la lista de elementos no se encuentra debajo del cuadro de texto, sino que está desplazada a la derecha. mi código es:

<asp:ScriptManager ID="ScriptManager1" runat="server" EnableScriptGlobalization="true"> 
     <Services> 
     </Services> 
     <Scripts> 
      <asp:ScriptReference Path="~/JavaScript/ScriptManager.js" /> 
     </Scripts> 
</asp:ScriptManager> 

<div> 
    <asp:Panel ID="dialog" runat="server"> 
     <div id="dialogContents"> 
      <asp:ComboBox ID="DropDownListMailTos" runat="server" AutoPostBack="true" 
       DropDownStyle="DropDown" Width="90%" RenderMode="Block"> 
       <asp:ListItem Text="1" Value="1" /> 
       <asp:ListItem Text="2" Value="2" /> 
       <asp:ListItem Text="3" Value="3" /> 
      </asp:ComboBox> 
      <br /> 
      <asp:Button ID="btnOK" Text="OK" runat="server" /> 
     </div> 
    </asp:Panel> 

    <asp:Button ID="btnShow" Text="Open Dialog" runat="server" /> 

    <asp:ModalPopupExtender 
     TargetControlID="btnShow" 
     PopupControlID="dialog" 
     OkControlID="btnOK" 
     DropShadow="true" 
     BackgroundCssClass="modalBackground" 
     runat="server" /> 
</div> 

he intentado algunas soluciones encontraron here y here

pero no hay suerte. ¿Qué puedo hacer al respecto?

Answer 1

Parece que el único problema aquí es que el ModalPopup está en conflicto con el estilo predeterminado de ComboBox. Solo necesita jugar con la clase CSS que se aplica al ListItem en el ComboBox para que se muestren correctamente. Agregue el código siguiente CSS para esa página (probado en IE9, Chrome y Firefox) y usted debe ser bueno:

.ajax__combobox_itemlist 
{ 
    position:fixed !important; 
} 

Para obtener más información, consulte la sección "Cuadro combinado Tematización" en la parte inferior de el documentation page.