Ajax Accordion Style Issue

當手風琴呈現屏幕時，手風琴顯示正常，但是每當展開的窗格發生更改時，最後一個手風琴窗格的底部都隱藏起來。Ajax Accordion Style Issue

手風琴存儲在母版頁的內容佔位符中，母版頁上的內容佔位符在沒有指定高度的div內。

編輯 - 手風琴似乎不正確地計算其高度，所以當在IE中使用開發人員工具欄時，您可以看到手風琴高度自動更新，只要標籤更改不正確。

當屏幕呈現 -

enter image description here

的HTML是 - -

頁與問題 -

enter image description here

點擊不同的窗格後

<asp:Content runat="server" ContentPlaceHolderID="ContentPlaceHolderMain"> 
       <h2 style="width: 836px">Manage Fields</h2> 
       <br /> 
       <cc1:Accordion ID="uxAccordion" runat="server" SelectedIndex="2"> 
        <Panes> 
         <cc1:AccordionPane ID="pane1" runat="server" ContentCssClass="accordionContent" HeaderCssClass="accordionHead" BorderStyle="Solid" BorderWidth="1" BorderColor="Black"> 
          <Header> 
           <h3>> Custom Categories</h3> 
          </Header> 
          <Content> 
           <div class="accordionInnerContainer"> 
            <uc1:CustomCategories ID="CustomCategories1" runat="server" /> 
           </div> 
          </Content> 
         </cc1:AccordionPane> 
         <cc1:AccordionPane ID="pane2" runat="server" ContentCssClass="accordionContent" HeaderCssClass="accordionHead" BorderStyle="Solid" BorderWidth="1" BorderColor="Black"> 
          <Header> 
           <h3>> Custom Fields</h3> 
          </Header> 
          <Content> 
           <div class="accordionInnerContainer"> 
            <uc2:CustomFields ID="CustomFields1" runat="server" /> 
           </div> 
          </Content> 
         </cc1:AccordionPane> 
         <cc1:AccordionPane ID="pane3" runat="server" ContentCssClass="accordionContent" HeaderCssClass="accordionHead" BorderStyle="Solid" BorderWidth="1" BorderColor="Black"> 
          <Header> 
           <h3>> Custom Help</h3> 
          </Header> 
          <Content> 
           <div class="accordionInnerContainer"> 
            <uc3:CustomHelp ID="CustomHelp2" runat="server" /> 
           </div> 
          </Content> 
         </cc1:AccordionPane> 
        </Panes> 
       </cc1:Accordion> 
</asp:Content>

母版頁 -

<body class="onecol"> 
    <form id="form1" runat="server"> 
    <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager> 

    <div id="bodyContainer"> 
     <div id="headerContainer">  
      <uc2:UserPanel id="UserPanel1" runat="server"></uc2:UserPanel> 
      <uc3:PrimaryNav ID="PrimaryNav1" runat="server" /> 
     </div> 
      <div id="mainContainer"> 
       <asp:ContentPlaceHolder ID="ContentPlaceHolderMain" runat="server"> 
       </asp:ContentPlaceHolder> 
      </div> 

     <div id="subNav"> 
      <p>&nbsp;</p> 
     </div> 

     <div id="sideContainer"> 

     </div> 

     <div id="footer"> 
      <uc1:footer ID="Footer1" runat="server" /> 
     </div> 
    </div> 
    </form> 
</body>

的CSS -

body{font: 72% arial,sans-serif;text-align:center} 
div#bodyContainer{text-align:left;width:900px;margin:0 auto;background-color:#FFF;} 
div#headerContainer{background:url(../images/headerbackgrad.jpg) repeat-x;height:116px;} 
div#mainContainer{float:left;width:100%} 
div#contentContainer{margin: 0 470px 0 0} 
div#subNav{float:left;width:150px;margin-left:-700px} 
div#subNav{display:none;} 
div#sideContainer{float:left;width:400px;margin-left:-420px} 
div#footer{clear:left;width:100%} 
div#mainContainer{min-height:400px;_height:400px;} 

.accordionHead 
{ 
    padding: 1px; 
    font-weight:bold; 
    background-color:#ceeffe; 
    border-bottom: 1px solid black; 
} 

.accordionContent 
{ 

} 

.accordionInnerContainer 
{ 
    width: 850px; 
    padding-left: 5px; 
}

預先感謝任何幫助。

來源

2014-02-14 user1948635

這不正是應該發生的？ – Adosi

改變東西的東西。 - 無法回答沒有代碼的工作！ –

第二張圖像中的底部手風琴窗格被切斷，您只能看到部分標題。不適用HTML修改上面的帖子 – user1948635

找到了解決方案，設置以下的手風琴各種各樣的問題 -

AutoSize="Limit"

來源

2014-02-14 14:30:13 user1948635

Ajax Accordion Style Issue

回答

相關問題