#1
  1. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    May 2002
    Location
    t.o.
    Posts
    82
    Rep Power
    13

    css layout issues


    Can someone tell me what's going on with my css lsyout.

    http://www3.sympatico.ca/timarney/temp/layout.htm

    This is the first time I doing layout with CSS-P so I don't know all the in and outs yet.

    The first thing I notice is that in ie... scrollbars apear when there is no need for them.

    In Opera the left nav streches well past the area for the main content. Any tips on how to fix/improve this sort of layout would be much apreciated.

    Here's the code...

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
    <title>--</title>
    <style type="text/css">
    body, html{
    	height:100%;
    	margin:0px;
    	padding:0px;
    	text-align:center;
    	background:#E0E0E0;
    }
    
    #container,#header{
    	width:760px;
    	margin-left:auto;
    	margin-right:auto;
    	text-align:left;
    }
    	
    #container{
    	height:100%;
    	min-height:100%;
    	background: #FFFFFF;
    }
    
    #header{
    	height:155px;
    	background:#A9A99F;
    }
    
    #leftnav{
    	height:100%;
    	background: #F5F5F5;
    	width:150px;
    	float: left;
    }
    
    #main{
    	text-align: left;
    	vertical-align: top;
    
    }
    </style>
    </head>
    <body>
    <div id="container">
    <div id="header">header</div>
    <div id="leftnav">left hand nav</div><div id="main">main</div>
    </div>
    </body>
    </html>
  2. #2
  3. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    May 2002
    Location
    t.o.
    Posts
    82
    Rep Power
    13
    Okay, I've seem to have got it worked out for the most part...

    http://www3.sympatico.ca/timarney/temp/layout01.htm

    if I remove the header the scrolling will go away..How can I take the height of the header into account when dealing with percentages?

IMN logo majestic logo threadwatch logo seochat tools logo