views:

86

answers:

1

I have a master page which is using the style sheet..

My problem is that my vertical scrollbar does not work and horizontal scrollbar is not showing when i restore down the page.

here is my .aspx code..

<%@ 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"&gt;
<html xmlns="http://www.w3.org/1999/xhtml"&gt;
<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>

**

And here is my Css file code..

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

I have tried a lot of stuff but nothing seems to work... it will be great if some 1 could have a look and guide me in the right direction..

Thanks

when the browser window is restored down the content on the page gets cramped up..

This means i have to keep the content in the body or main to be fixed.. i dont know how to do that any help..???

+1  A: 

In your css class, in the body definition, if you remove

position: fixed;

then the scrollbars appear.

rip
yes the scrollbars did appear to work, but when i restore down the browser window the all the content on the page gets cramped up... please could you help me with that... thanks
I’m not sure what you mean by "restore down" the browser and the page gets "cramped up"?
rip
restore down is the button next to browser minimize button... on the top right corner..