2014-09-30 42 views
0

我有以下ASP.net代碼是向用戶顯示一個彈出窗口:爲什麼在div下的下拉列表顯示

<div id="popupContact"> 
    <a id="popupContactClose" title="Close Window">x</a> 
    <h3>Add a New Message</h3> 
    <div id="dvFirst" class="mainSecond"> 
     <div id="leftdiv3" class="leftdiv">Client: </div> 
     <div id="rightdiv3" class="rightdiv" style="z-index: 100;"><asp:DropDownList ID="ddlCliNewMsg" AutoPostBack="false" ClientIDMode="Static" runat="server" CssClass="chosen-select" ></asp:DropDownList></div> 
    </div> 
    <div id="dvSecond" class="mainSecond"> 
     <div id="leftdiv4" class="leftdiv">Location: </div> 
     <div id="rightdiv4" class="rightdiv" style="z-index: 100;"><asp:DropDownList ID="ddlSitNewMsg" AutoPostBack="false" ClientIDMode="Static" runat="server" CssClass="chosen-select"></asp:DropDownList></div> 
    </div> 
    <div id="dvSixth" class="mainSecond"> 
     <div id="leftdiv6" class="leftdiv">Specialty: </div> 
     <div id="rightdiv6" class="rightdiv" style="z-index: 100;"><asp:DropDownList ID="ddlPraNewMsg" AutoPostBack="false" ClientIDMode="Static" runat="server" CssClass="chosen-select"></asp:DropDownList></div> 
    </div> 
    <div id="dvThird" class="mainSecond"> 
     <div id="leftdiv5" class="leftdiv">Provider: </div> 
     <div id="rightdiv5" class="rightdiv" style="z-index: 100;"><asp:DropDownList ID="ddlProNewMsg" AutoPostBack="false" ClientIDMode="Static" runat="server" CssClass="chosen-select"></asp:DropDownList></div> 
    </div> 
    <div id="dvFourth" class="mainFirst"> 
     <div id="leftdiv1" class="leftdivspec"><sup style="color: #FF0000; font-weight: bold;">*</sup>Message: </div> 
     <div id="rightdiv1" class="rightdivspec"><asp:TextBox ID="tbMessage" ClientIDMode="Static" runat="server" TextMode="MultiLine" Columns="30" Rows="5"></asp:TextBox></div> 
    </div> 
    <div id="dvFifth" class="mainSecond"> 
     <div id="leftdiv2" class="leftdiv">Active?</div> 
     <div id="rightdiv2" class="rightdiv"><asp:CheckBox ID="cbIsActive" ClientIDMode="Static" runat="server" /></div> 
    </div> 
    <div style="width: 96%; text-align: right; padding: 2%;"> 
     <asp:UpdatePanel runat="server" ID="upSubmit" ClientIDMode="Static" UpdateMode="Conditional"> 
      <ContentTemplate> 
       <asp:Button ID="btnSubmit" runat="server" Text="Submit" CssClass="btnSubmit" ClientIDMode="Static" UseSubmitBehavior="false" OnClick="SubmitAdminMessage" /> 
      </ContentTemplate> 
     </asp:UpdatePanel> 
    </div> 
</div> 

的CSS:

.mainFirst 
{ 
    width: 95%; 
    margin: auto; 
    padding: 1%; 
    height: 90px; 
    border-bottom: 1px dotted #808080; 
} 
.mainSecond 
{ 
    width: 95%; 
    margin: auto; 
    padding: 1%; 
    height: 30px; 
    border-bottom: 1px dotted #808080; 
    overflow: hidden; 
} 
.leftdiv 
{ 
    width: 35%; 
    height: 30px; 
    float: left; 
    font-weight: bold; 
} 
.rightdiv 
{ 
    width: 65%; 
    height: 30px; 
    float: left; 
} 

最初時彈出窗口負載,它顯示是這樣的:

enter image description here

每當我本身LECT從下拉列表的東西,它會在它下面的DIV下:

enter image description here

我如何修改CSS使每個DropDownList的將出現在容器外,因此將顯示的選項?

回答

1

您可以嘗試在容器類中添加「overflow:visible」