Jump to content

Css Issue, I Cant Figure It Out...


Dareus

Recommended Posts

Ok, I tried making a header div, a links div, a main content div, and a footer div... but i tried to wrap a div around them all to easily change the background color of it to white and the outside to black. But I would have black all between the links and main div, and it just wouldnt go :) the styles sheet is at www.318desprairies.com/styles.cssBUT... i'm giving up on that for now but if someone had the time to just look for a second as to why the .con div wouldnt wrap around it... but can someone help me with the below..Ok here's the basic setup a Fixed header 950px wideA fixed left links area say 150px wide,A fixed body main page of 800px wideand a fixed footer with a width of 950pxThe only thing I want to have scrolling is the Main pageI want it all wrapped in one div so I can make the background in that div white, and have the background of the site black.Also I think the height of the body needs to be 100% so it can fit on any size screen, but I want the width fixed.Thanksif I need to make a few changes to the px I can no problem but Just need help with the initial setup.ThanksAll I want is the header to always be the same, and the footer. i just want the body main to scroll.Can someone help me set this up? i'll build the rest of the site from there.For reference, The site I am working on is www.318desprairies.com password is 318DPL (after you click Englsih) So you can see the setup I am trying to accomplish. but since I changed the background to black everything got messed up and now someone told me I should of built it using %'s. I havent done that before and need to have this done for tomorrow as a sample.Please any help would be great. I'll follow the template and build the site from there.ThanksD

Link to comment
Share on other sites

i'm pretty new at this aswell so maybe this code is not perfect but is works i think.here is the html:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"><title>Insert title here</title><link rel="stylesheet" type="text/css" href="some.css" media="all"></head><body><div id="wrapper">	<div id="header">	your header	</div>			<div id="links">		<ul><li>first link</li>			<li>second link</li>			<li>third link</li>			<li>...</li>		</ul>	</div>		<div id="page">	main content<br>	If you change the 'overflow: scroll' to 'overflow: auto' the bars at side and the bottom will <br>	only appear if they have to.	</div>		<div id="footer">	your footer	</div></div></body></html>

and the css:

*	{	margin: 0;		padding: 0;}body	{	background-color: #000000;            height: 100%;}#wrapper	{	background-color: #FFFFFF;				width: 1050px;				height: 600px;				padding-left: 80px;				position: relative;				margin-left: auto;				margin-right: auto;				margin-top: 10px;}#header	{	background-color: #0000FF;			height: 75px;			width: 950px;}#links	{	background-color: #DEB887;			width: 150px;			height: 450px;			float: left;}#page	{	background-color: #D004BF;			height: 450px;			width: 800px;			float: left;			overflow: scroll;}#footer	{	background-color: #0000FF;					height: 75px;					width: 950px;					float: left;					clear: both;}

if there are remarks or questions pleaselet me know

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...