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

    Join Date
    Sep 2001
    Posts
    289
    Rep Power
    13

    Problems with CSS layouts


    I'm having an issue with a CSS layout I"m working on.
    1.For some off reason the div element for my page footer appears to think its inside of the mbox div.
    no matter what I have tried I can't get the pagebot div to the bottom of browser.
    2. Width of 100% still leaves 30 or so px's on the right, any reason for this?
    3. setting a min-height of 500 or so for mbox or innerbox divs has been ignored.
    Code:
    <html>
    <head>
    	<title>Untitled</title>
    	<style>
    	#container {
    		position: absolute;
    		top: 0px;
    		left: 0px;
    		width: 100%;
    		height: 100%;
    	}
    	#pagetop{
    		position: relative;
    		top: 0px;
    		background-color: #ADD8E6;
    		width: 100%;
    		height: 65px;
    	}
    	#pagebot {
    		position: relative;
    		background-color: #ADD8E6;
    		height: 65px;
    		clear: both;
    	}
    	#mbox {
    		position: relative;
    		border: 5px solid #000;
    	}
    	#innerbox {
    		position: relative;
    		left: 10px;
    	}
    	div{
    		border: 1px solid red;
    	}
    	</style>
    </head>
    <body>
    <div id="container">
    	<div id="pagetop"></div>
    	<div id="mbox">
    		<div><img src='imgs/logo_tot_grey.jpg' width='280' height='95' alt='' border='0'></div>
    		<div id="innerbox">
    			<p>Test</p>
    		</div
    	</div>
    	<div id="pagebot"></div>
    </div>
    </body>
    </html>
  2. #2
  3. |<.+#f@#+.&.|
    Devshed Loyal (3000 - 3499 posts)

    Join Date
    Mar 2002
    Location
    norway
    Posts
    3,009
    Rep Power
    1224
    you are missing a > on of the closing div-tag
    to the innerbox div


    2.
    add
    body {
    margin:0;
    padding:0;
    }

    to get it to use the whole width

    3.
    msie doesn't support min-height, should work in the other browsers like mozilla, opera etc.
    http://www.quirksmode.org/css/width.html
    Last edited by Akh; April 17th, 2004 at 04:54 PM.
  4. #3
  5. Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Sep 2001
    Posts
    289
    Rep Power
    13
    Originally Posted by Akh
    you are missing a > on of the closing div-tag
    to the innerbox div


    2.
    add
    body {
    margin:0;
    padding:0;
    }

    to get it to use the whole width

    3.
    msie doesn't support min-height, should work in the other browsers like mozilla, opera etc.
    http://www.quirksmode.org/css/width.html
    Thanks for your assistance...

IMN logo majestic logo threadwatch logo seochat tools logo