【问题标题】:vertical and horizontal scrolls not working垂直和水平滚动不起作用
【发布时间】:2009-11-09 00:37:37
【问题描述】:

我有一个使用样式表的母版页..

我的问题是当我向下还原页面时,我的垂直滚动条不起作用并且水平滚动条没有显示。

这是我的 .aspx 代码..

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>test</title>
    <meta name="generator" content="HTML Tidy for Linux/x86 (vers 1 September 2005), see www.w3.org" />
  <meta http-equiv="Content-Type" content="text/html; charset=us-ascii" />
<link href="NewFolder1/style.css" rel="stylesheet" type="text/css" />

    <style type="text/css">
        .style1
        {
            font-size: medium;
            font-weight: bold;
        }
        .style2
        {
            text-align: left;
        }
    </style>

</head>
<body bgcolor="#6794cb" >
<form id="form2" runat="server"  
style="background-color: #6794CB;padding-bottom:1%; padding-top: 2%; width:100%; height:100%;">
  <div id="container" style="visibility: visible;">
    <div id="header">
        <div class="style2">
            &nbsp;&nbsp;&nbsp;
        <asp:TextBox ID="TextBox1" runat="server" BorderColor="#000099" BorderWidth="2px"></asp:TextBox>
            &nbsp;
        <asp:Button ID="Button1" runat="server" Text="Search" BackColor="#ADC6C9" 
                BorderColor="#CCCCCC" BorderStyle="Outset" />
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <asp:HyperLink ID="HyperLink1" runat="server">corp\tbruschi</asp:HyperLink>
            &nbsp;
        <asp:HyperLink ID="HyperLink2" runat="server">Settings</asp:HyperLink>
            &nbsp;
        <asp:HyperLink ID="HyperLink3" runat="server">Help</asp:HyperLink>
            &nbsp;
        <asp:HyperLink ID="HyperLink4" runat="server">LogOff</asp:HyperLink>
        <br />
        <br />
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;
        <span class="style1"><br />
            </span><br />
            <asp:Panel ID="Panel1" runat="server" Width="100%">
                <hr style="padding: 1px; background-color: #000000" />
            </asp:Panel>
        <br />
       </div>
        </div>
    <!-- end header -->
    <div id="left">

       <asp:Panel ID="Panel3" runat="server" Height="100%" ScrollBars="Auto" 
                    Width="100%">

    <p>
          &nbsp;</p>

        <br />
        <asp:TreeView ID="TreeView2" runat="server"  OnUnload="TreeViewMain_Unload" 
            ontreenodepopulate="TreeView2_TreeNodePopulate" 
            onselectednodechanged="TreeView2_SelectedNodeChanged">
            <Nodes>
                <asp:TreeNode PopulateOnDemand="True" Text="Machine Groups"
                    Value="Machine Groups"></asp:TreeNode>
            </Nodes>
        </asp:TreeView>
        <br />
        <asp:TreeView ID="TreeView3" runat="server" OnUnload="TreeView3_Unload" 
            ontreenodepopulate="TreeView3_TreeNodePopulate" 
             onselectednodechanged="TreeView3_SelectedNodeChanged">
            <Nodes>
                <asp:TreeNode PopulateOnDemand="True" Text="Policies"
                    Value="Policies"></asp:TreeNode>
            </Nodes>
        </asp:TreeView>
           <br />
        </asp:Panel>
        </div>
    <div id="content-wrapper">
      <div id="content-inner">

      <!-- end left division -->

       <div id="main">
             <asp:ContentPlaceHolder id="ContentPlaceHolder2" runat="server">

        </asp:ContentPlaceHolder>
       </div>
    </div>
    </div>  <!-- end footer -->
   </div>

  </form>


</body>

</html>

**

这是我的 Css 文件代码..

    body
{
    font-family: arial, verdana, helvetica, sans-serif;
    font-size: 12px;
    cursor: default;
    background-color: #FFFFFF;
    width: 100%;
    height: 100%;
}
*
{
    margin: 0px 0px 0px 1px;
    padding: 0px;
    text-align: left;

}
html
{
    height: 100%;
    margin-bottom: 1px;

}
#container
{
    width: 80%;
    margin-right: auto;
    margin-left: auto;
    text-align: left;
    background-color: #FFFFFF;
    height: 595px;

}
#header {
    width:100%;
    padding-top:15px;
    height: 121px;
}
.spacer {
    width:100%;
    height:15px;
}
hr {
    border-style: none;
    border-color: inherit;
    border-width: 0px;
    color:Black;
        background-color:#CDCDCD;
    height: 0px;
        width: 100%;
        text-align: left;
}
h1 {
    font-size:28px;
    color:white;
    background-color: #4F81BD;
    font-family:Arial, Verdana, Helvetica, sans-serif;
    font-weight:300;
}
h2 {
    font-size:15px;
    color:Black;
    font-family:Arial, Verdana, Helvetica, sans-serif;
    font-weight:300;
    background-color:#FFFFFF;
}
h3 {
    color:Black;
    font-size:15px;
    text-align:left;
    font-weight:300;
    padding:5px;
    margin-top:5px;
}

#left {
    float:left;
    width:250px;
    background-color:#FFFFFF;
    color:black;
    height: 417px;
}

#main
{
    margin: 1px 5px 5px 260px;
    border-left: 1px solid silver;
    height: 409px;
    padding-right: 3px;
    padding-bottom: 3px;
    padding-left: 3px;
}
p {
    color:black;
    background-color:#FFFFFF;
    line-height:20px;
    padding:5px;
}
a {
    color:Blue;
    text-decoration:none;
}
a:hover {
    color:#cc0000;

    text-decoration:underline;
}
#footer {
    clear:both;
    font-size:12px;
    font-family:Verdana, Arial, Helvetica, sans-serif;
}
.right {
    color:gray;
    background-color:#FFFFFF;
    float:right;
    font-size:100%;
    margin-top:5px;
}
.left {
    color:gray;
    background-color:#FFFFFF;
    float:left;
    font-size:100%;
    margin-top:5px;
}

我尝试了很多东西,但似乎没有任何效果......如果有人能看看并引导我朝着正确的方向前进,那就太好了......

谢谢

当浏览器窗口向下恢复时,页面上的内容会变得拥挤..

这意味着我必须将内容保留在正文或主要内容中才能修复..我不知道如何做任何帮助..???

【问题讨论】:

  • 是否添加“溢出:自动;”在你的 CSS 的#main 部分有什么不同吗?

标签: asp.net html css visual-studio-2008 master-pages


【解决方案1】:

在您的 css 类中,在 body 定义中,如果您删除

位置:固定;

然后出现滚动条。

【讨论】:

  • 是的,滚动条看起来确实可以工作,但是当我恢复浏览器窗口时,页面上的所有内容都变得狭窄......请你帮我解决这个问题......谢谢跨度>
  • 我不知道您所说的“还原”浏览器和页面变得“拥挤”是什么意思?
  • 还原向下是浏览器最小化按钮旁边的按钮...在右上角..
猜你喜欢
  • 2014-01-09
  • 1970-01-01
  • 1970-01-01
  • 2020-08-17
  • 2015-05-31
  • 2013-11-30
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多