Question

我在网页上有以下布局

    <asp:panel id="overview_pnl">
      <asp:panel id="top_row" CssClass="overviewRows">
        <ajaxToolKit:Accordion>
           <Panes>
              <AccordionPane id="pane1">

                  <header> ... </header>
                  <content> <div id="detail" class="details"> </div> </content>          

              </AccordionPane>
          </Panes>
        </ajaxToolKit:Accordion>
      </asp:panel >
      <asp:panel id="middle_row">
         ... same as top row ...
      </asp:panel >

      <asp:panel id="bottom_row">

      </asp:panel >

  </asp:panel >

的CSS

.overviewRows { width:508px; vertical-align:top; display:inline-block; float:left;  }
.details {
    margin: 0 2px;
    padding: 10px 5px;
    width: 154px;
    border: 1px #CCC solid;
    border-top: none;
    display: block;
    font-size: 12px;
    text-align: left;
}

我希望id为“top_row”的div将其高度扩展为适合整个窗格并向下按下中间和底部div，以便内容不会溢出到它们中。

我在css中尝试了overflow，但它并没有按照我想要的方式运行。在手风琴扩展之前，它为高度带来了滚动条，我不得不滚动查看数据。我只是想把它推倒一切，我不知道该怎么做。

Answer 1

你知道你想要手风琴的高度吗？您可以添加min-height属性以确保它满足该要求吗？

增加div高度以适合ajax手风琴

1 个答案: