0

我正在使用带有 asp.net 的母版页，我是 CSS 的菜鸟，因此在搜索 google 和 stackoverflow 帖子后也尝试了很多属性，但我不知道如何解决这个问题，除了左侧菜单，它应该动态占据页面的所有高度，最后我包含了产品页面（buy.aspx）的屏幕截图，产品 T2 和它下面的所有其他产品都与类别对齐，而它们应该对齐在页面上的第一个产品下，请帮助

母版页

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Site.master.cs" Inherits="E_Auction.Site" %>
<html>
<head runat="server">

<style type="text/css">
body 
{ 
  margin-top: 0px;
  margin-left: 5%;
  margin-right: 5%;
  background-color: Teal;
}
#header {
  padding: 1px;
  margin-left:5%;
  margin-right:5%;
  background-color: White;
  margin-bottom: 0px;
}
#left {
  float:left;
  margin-left: 5%;
  background-color:White;
    }
#center 
{
  margin-top: 0px;
  background-color: White;
  margin-left: 5%;
  margin-right: 5%;
  overflow:scroll;

}
    .style1
    {
        text-align: center;
    }
    .internal
    {
        text-decoration: none;
    }    
a:link, a:hover, a:visited, a:active {color: blue;}
</style>
    <asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>
</head>

<body>

    <form id="form1" runat="server">

<div id="header" style="background-image:url(Images/banner.gif);background-repeat:no-repeat;">

<table style="height:27%;width:88%">
<tr colspan="2">
    <td style="text-align: right">
    <asp:LinkButton ID="lnkMyAccount" runat="server" PostBackUrl="~/account.aspx" ForeColor="White" Font-Bold="true" Font-Underline="false">My Account</asp:LinkButton>&nbsp&nbsp
    <asp:LinkButton ID="lnkBuy" runat="server" PostBackUrl="~/buy.aspx" ForeColor="White" Font-Bold="true" Font-Underline="false">Buy</asp:LinkButton>&nbsp&nbsp
    <asp:LinkButton ID="lnkSell" runat="server" PostBackUrl="~/sell.aspx" ForeColor="White" Font-Bold="true" Font-Underline="false">Sell</asp:LinkButton>&nbsp&nbsp
    <asp:LinkButton ID="lnkAboutUs" runat="server" PostBackUrl="~/about.aspx" ForeColor="White" Font-Bold="true" Font-Underline="false">About Us</asp:LinkButton>&nbsp&nbsp
    <asp:LinkButton ID="lnkContactus" runat="server" PostBackUrl="~/contact.aspx" ForeColor="White" Font-Bold="true" Font-Underline="false">Contact Us</asp:LinkButton>
    </td>
</tr>
<tr>
    <td style="text-align: right">
    <br /><span class="style1"><strong>Search</strong></span>&nbsp<asp:TextBox ID="txtSearch" runat="server" Width="170px"></asp:TextBox>&nbsp<asp:Button ID="btnGo" runat="server" Text="Go" Width="39px" Height="23px" />
    </td>
</tr>
<tr>
<td valign="bottom"><asp:SiteMapPath ID="smPath" runat="server" ForeColor="White"></asp:SiteMapPath></td>
</tr>
    </table>

</div>


<div id="left">

  <table>
            <tr>
                <td valign="top" style="background-color:Silver;color:White;font-weight:bold;text-align:center;">
                    Category
                </td>
            </tr>
            <tr>
                <td valign="top" class="style1">
    <asp:DataList ID="DataList1" runat="server" DataSourceID="dsCats">
        <ItemTemplate>
           <a href="buy.aspx?catid=<%# Eval("catid") %>" class="internal"><asp:Label ID="catitleLabel" runat="server" Text='<%# Eval("catitle") %>' />
        </ItemTemplate>
    </asp:DataList>
    <asp:SqlDataSource ID="dsCats" runat="server" 
        ConnectionString="<%$ ConnectionStrings:EAuctionConnectionString %>" 
        SelectCommand="SELECT [catid], [catitle] FROM [Category]"></asp:SqlDataSource>
                </td>
            </tr>
        </table>
 </div>

<div id="center">
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">

</asp:ContentPlaceHolder>
</div>

    </form>

</body>
</html>

以下是内容页面

<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="buy.aspx.cs" Inherits="E_Auction.buy" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <title>E-Auction::Buy Products</title>

    <style type="text/css">

    .topbanners
    {
        border: none;
    } 
    </style>

</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">


        <asp:ListView ID="ListView1" runat="server" DataKeyNames="prodid" 
            DataSourceID="SqlDataSource1">


            <EmptyDataTemplate>
                <span>No data to show.</span>
            </EmptyDataTemplate>
            <ItemTemplate>


                <table width="50%">

                <tr>
                <td colspan="2"><strong>
                <asp:Label ID="prodnameLabel" runat="server" Text='<%# Eval("prodname") %>' />
                </strong></td>
                </tr>

                <tr>
                <td rowspan="8"><img src='/Pimages/<%# Eval("prodimagename") %>' height="150px" width="150px" /></td>
                </tr>

                <tr>
                <td align="right">
                <b></strong><asp:Label ID="capcategory" runat="server" Text="Category" /></b>
                <asp:Label ID="Label2" runat="server" Text='<%# Eval("cat_title") %>' /></td>
                </tr>

                <tr>
                <td align="right">
                <asp:Label ID="capbidstartprice" runat="server" Text="Bid Start Price: " visible='<%# (Convert.ToInt32(Eval("pricetype")) == 1) ? true : false %>' />
                <asp:Label ID="bidstartpriceLabel" runat="server" Text='<%# Eval("bidstartprice") %>' visible='<%# (Convert.ToInt32(Eval("pricetype")) == 1) ? true : false %>' /></td>
                </tr>

                <tr>
                <td align="right">
                <asp:Label ID="captotalbids" runat="server" Text="Total Bids: " visible='<%# (Convert.ToInt32(Eval("pricetype")) == 1) ? true : false %>' />
                <asp:Label ID="totalbids" runat="server" Text='<%# Eval("TotalBids") %>' visible='<%# (Convert.ToInt32(Eval("pricetype")) == 1) ? true : false %>'/>
                </tr>

                <tr>
                <td align="right">
                <asp:Label ID="capbidenddate" runat="server" Text="Bid Ends At: " visible='<%# (Convert.ToInt32(Eval("pricetype")) == 1) ? true : false %>' />
                <asp:Label ID="bidenddate" runat="server" Text='<%# Eval("bidenddate") %>' visible='<%# (Convert.ToInt32(Eval("pricetype")) == 1) ? true : false %>'/>
                </tr>

                <tr>
                <td align="right">
                <asp:Label ID="capbuyprice" runat="server" Text="Buy Price: " visible='<%# (Convert.ToInt32(Eval("pricetype")) == 0) ? true : false %>' />
                <asp:Label ID="buyprice" runat="server" Text='<%# Eval("buyprice") %>' visible='<%# (Convert.ToInt32(Eval("pricetype")) == 0) ? true : false %>'/>
                </tr>

                <tr>
                <td align="right">
                <asp:Label ID="captax" runat="server" Text="Tax: " visible='<%# (Convert.ToInt32(Eval("pricetype")) == 0) ? true : false %>' />
                <asp:Label ID="tax" runat="server" Text='<%# Eval("tax") %>' visible='<%# (Convert.ToInt32(Eval("pricetype")) == 0) ? true : false %>'/>
                </tr>

                <tr>
                <td align="right">
                <asp:Label ID="captotalbuyprice" runat="server" Text="Total: " visible='<%# (Convert.ToInt32(Eval("pricetype")) == 0) ? true : false %>' />                
                <asp:Label ID="totalbuyprice" runat="server" Text='<%# Eval("TotalBuyPrice") %>' visible='<%# (Convert.ToInt32(Eval("pricetype")) == 0) ? true : false %>'/>
                </tr>

                <tr>
                <td align="right">
                <a href='buyform.aspx?id=<%# Eval("prodid") %>' class="internal">
                <asp:Image ID="Image1" ImageUrl='/Images/buy.png' runat="server" Visible='<%#(Convert.ToInt32(Eval("pricetype")) == 0) ? true : false%>' CssClass="topbanners"/>
                </a>
                <a href='bidform.aspx?id=<%# Eval("prodid") %>' class="internal">
                <asp:Image ID="Image2" ImageUrl='/Images/bid.png' runat="server" Visible='<%#(Convert.ToInt32(Eval("pricetype")) == 1) ? true : false%>' CssClass="topbanners"/>
                </a>
                </td>
                </tr>

                <tr colspan="2">
                <td><b>Description</b><br /><asp:Label ID="Label5" runat="server" Text='<%# Eval("description") %>' />
                </tr>

</table>
<br />

            </ItemTemplate>

            <LayoutTemplate>
                <div ID="itemPlaceholderContainer" runat="server" style="">
                    <span runat="server" id="itemPlaceholder" />
                </div>
                <div style="">
                      <p align="center">
                    <asp:DataPager ID="DataPager1" runat="server">
                        <Fields>
                            <asp:NextPreviousPagerField ButtonType="Button" ShowFirstPageButton="True" 
                                ShowNextPageButton="False" ShowPreviousPageButton="False" />
                            <asp:NumericPagerField />
                            <asp:NextPreviousPagerField ButtonType="Button" ShowLastPageButton="True" 
                                ShowNextPageButton="False" ShowPreviousPageButton="False" />
                        </Fields>
                    </asp:DataPager>
                                </p>
                </div>
            </LayoutTemplate>


        </asp:ListView>
        <br />


        <asp:SqlDataSource ID="SqlDataSource1" runat="server" 
            ConnectionString="<%$ ConnectionStrings:EAuctionConnectionString %>" 
            SelectCommand="SELECT [prodid], (Select catitle from Category where catid=p.catid) as cat_title,[prodname],[description],[pricetype],[buyprice],[tax],[bidstartprice],[bidenddate],[prodimagename],[isforsale],[addedon], [btnname], (Select count(prod) from Bid where prod=p.prodid) as TotalBids, (tax+buyprice) as TotalBuyPrice FROM Product p where isforsale=1 Order by addedon Desc">
        </asp:SqlDataSource>

        <table runat="server" id="tblAll" width="70%" align="center">

</table>

    </asp:Content>

产品页面图片： 在此处输入图像描述

4

1 回答 1

0

您需要在左侧菜单中放置 100% 的高度属性。但不仅如此，您还需要在 html、body 和任何其他容器元素上设置高度。如果您将这些全部设置为 100%，那么应该这样做。

height:100%;
于 2013-05-01T06:39:24.980 回答