我的頁面高度會導致gridview出現問題

當我的gridview隨着數據變大，即當頁面大小增加到10時，gridview會在主頁面區域之外。圖像清楚地描述了我的話。任何人都可以幫我解決這個問題嗎？謝謝。在滾動DIV enter image description here 我的頁面高度會導致gridview出現問題

my CSS: 

     body 
     { 
      margin-top: 0px; 
      background-image: url('../Images/bg_gradient.png'); 
      background-repeat: repeat-x; 
      background-color: #c6dee8; 
     } 

     #wrapper 
     { 
      border: 0px solid green; 
      width: 980px; 
      margin-right: auto; 
      margin-left: auto; 
     } 


      #main 
     { 
      width: 978px; 
      min-height: 750px; 
      max-height: 1000px; 
      overflow: auto; 
      border: 1px solid black; 
     } 

     #leftContent 
     { 
      width: 180px; 
      min-height: 750px; 
      max-height: 1000px; 
      float: left; 
      border-right: 1px solid black; 
     } 
#recordDisplaydiv 
{ 
    padding-top: 50px; 
} 

My Markup Code: 

     <div id="recordDisplaydiv"> 
       <asp:UpdatePanel ID="UpdatePanel3" runat="server"> 
        <ContentTemplate> 
         <asp:GridView ID="gvContract" runat="server" AutoGenerateColumns="False" DataKeyNames="ContractID" 
          CssClass="mGrid" OnPageIndexChanging="gvContract_PageIndexChanging" OnRowCommand="gvContract_RowCommand" 
          EmptyDataText="No Record Exist" PageSize="10" AllowPaging="true"> 
          <AlternatingRowStyle CssClass="alt" /> 
          <Columns> 
           <asp:BoundField DataField="KeyWinCountNumber" HeaderText="KeyWin Count#" /> 
           <asp:BoundField DataField="ItemName" HeaderText="Item" /> 
           <asp:BoundField DataField="BrandName" HeaderText="Brand" /> 
           <asp:BoundField DataField="CountName" HeaderText="Count" /> 
           <asp:BoundField DataField="SellerName" HeaderText="Seller" /> 
           <asp:BoundField DataField="BuyerName" HeaderText="Buyer" /> 
           <asp:BoundField DataField="ContractNumber" HeaderText="Contract#" /> 
           <asp:BoundField DataField="ContractDate" HeaderText="Contract Date" /> 
           <asp:BoundField DataField="CountryFromName" HeaderText="Country From" /> 
           <asp:BoundField DataField="CountryToName" HeaderText="Country To" /> 
           <asp:BoundField DataField="UnitName" HeaderText="Unit Name" /> 
           <asp:BoundField DataField="TQty" HeaderText="Total Qty" /> 
           <asp:BoundField DataField="Vans" HeaderText="Vans" /> 
           <asp:BoundField DataField="UnitPrice" HeaderText="Unit Price" /> 
           <asp:BoundField DataField="TAmount" HeaderText="Total Amount" /> 
           <asp:TemplateField HeaderText="Delete"> 
            <ItemTemplate> 
             <asp:ImageButton ID="imgDelete" runat="server" ImageUrl='<%# isDelete_img(Session["isAdmin"].ToString()) %>' 
              CommandName="DeleteRecord" Enabled='<%# isDelete(Session["isAdmin"].ToString()) %>' 
              CommandArgument='<%# Eval("ContractID") %>' AlternateText="DeleteRecord" OnClientClick="return confirm_delete();" 
              Style='<%# delete_style(Session["isAdmin"].ToString()) %>' /> 
            </ItemTemplate> 
           </asp:TemplateField> 
           <asp:TemplateField HeaderText="Edit"> 
            <ItemTemplate> 
             <asp:ImageButton ID="imgEdit" runat="server" ImageUrl="~/Images/edit.png" CommandName="EditRecord" 
              CommandArgument='<%# Eval("ContractID") %>' AlternateText="EditRecord" /> 
            </ItemTemplate> 
           </asp:TemplateField> 
          </Columns> 
          <PagerStyle CssClass="pgr" /> 
         </asp:GridView> 
        </ContentTemplate> 
       </asp:UpdatePanel> 
       <div id="ContractbtnExportdiv"> 
        <asp:Button ID="btnExport" runat="server" CssClass="btnExportdiv" OnClick="btnExport_Click" /> 
       </div> 
      </div>

來源

2012-11-02 Abid Ali

你想要主容器有一個滾動條來顯示溢出或你想容器擴展與gridview？ – alimac83

用gridview擴展.. –

我們能否看到您的前端代碼？從外觀上看，你的容器有一個固定的高度，這會導致gridview溢出而不是強制容器擴展。你可以設置溢出：auto;在容器上，但會給滾動條。如果我能看到你的代碼，我可以給予更多的幫助 – alimac83

放GridView控件，將解決問題

<div style="width:300px;height:250px;overflow:auto;"> 
    <gridview> 
</div>

來源

2012-11-02 10:53:49

當我添加溢出到#main {}它工作，但滾動條出現。其次，當我向下滾動頁面時，#leftContent邊框從底部消失。 –

使用overflow-y:auto;屬性來解決這個問題。

div.classname { 
    overflow-y:auto; 
}

來源

2012-11-02 11:01:17

我這樣做是由其他評論者告知的，但是當滾動條出現，並且當我向下滾動時，左側內容邊框從底部消失。 –

嘗試刪除：

max-height: 1000px;

從#main

和#leftContent的div

來源

2012-11-02 11:07:50 alimac83

這沒有幫助。 –

-1

使用溢出-y爲汽車和刪除maximum-height兩個面板，即用於#main和#leftContent和應用高度100％自動爲#leftContent。這可能有幫助。

來源

2012-11-02 11:13:57

不，這也不是解決問題，我真的不想要一個滾動條，但我希望我的頁面根據放置在GridView中的數據動態增加其高度。 –

然後嘗試增加最大高度值。而不是將其設置爲1000px將其設置爲較大的值。恩。 1800px –

和max-height屬性不起作用。 –

我的頁面高度會導致gridview出現問題

回答

相關問題