Question

我对手风琴有一些风格问题，当渲染屏幕时手风琴显示正确，但每当更改展开的窗格时，隐藏最后一个手风琴窗格的底部。

手风琴存储在母版页的内容占位符中，母版页上的内容占位符位于没有指定高度的div内。

编辑 - 手风琴似乎不正确地计算其高度，因此当使用IE中的开发者工具栏时，您可以看到无论何时更改标签，手风琴高度都会自动更新。

呈现屏幕时 -

enter image description here

点击其他窗格后

enter image description here

HTML是 -

有问题的页面 -

<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;
}

提前感谢您的帮助。

Answer 1

找到一个解决方案，在手风琴上设置以下问题 -

AutoSize="Limit"

Ajax手风琴风格问题

1 个答案: