Jump to content

Stretching a div between spaces?


Recommended Posts

Hello, I am new at this so I hope this is not a dumb question..I would like to have my footer at the bottom of the page, and have only my "content" div stretch between my navigation and the footer. How can I do that? Secondly, I would like to have an additional div (which will have an image, and is not present in the below code) positioned above all the other divs, and I would like to be referencing its position to the wrapper. eg -100px from top of wrapper and 100px from left of wrapper. Thank you in advancemy html code

<html><head><title>m2</title><link rel="stylesheet" type="text/css" href="main.css" /></head><body>   <!-- Begin Wrapper -->   <div id="wrapper">		 <div id="header">		       header		 </div>		 <div id="navigation">		     navigation		 </div>		 <div id="content">	         content 	         	     </div>		 <div id="footer">		       footer  		 </div>   </div>   <!-- End Wrapper -->   </body></html>

My CSS Code

*{padding: 0;margin: 0;}body{background-color: black;}#wrapper{margin: 0 auto;width: 960px;height: 100%;background-color: orange;}	#header{	float: left;	width: 960px;	height: 100px;	background: #BD9C8C;	}	#navigation{	float: left;	width: 960px;	height: 50px;	background-color: yellow;	}	#content{	float: left;	width: 960px;	height: 100%;	background-color: #F2F2E6;	}	#footer{	float: left;	width: 960px;	height: 50px;	background-color: white;	}	

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Create New...