can't place footer

jagguy · #1 07-07-2007, 10:35 AM

Hi,

I can't insert a footer using a div id at bottom of the page. The page length is unknown and i want to just fit it in under the last thing printed.

I have a nav bar to the left and heading. The main content area has items floated to the right. I have standard 3 main areas beofre the footer.

I add a footer and it appears as part of the main content area to the left on the same line as main content area.

The footer appears to the left of this but it isnt in the div.
div#contentinfo {
position:relative;
top:10px; /*border adds 2 px so i take them off*/
left: 10px;
width:150px;
height:220px;
z-index:2;
border:3px groove #666862;
float:right;
margin-right:30px;
// background: white;
background-image: url('camback.jpg') ;
}

last thing I add is
</div> <br><br>
<div id="footer">
asdsa
</div>
</body>
</html>

**ray326** · #2 07-07-2007, 10:57 AM

Well you've got both a position and a float in the contentinfo and there's no indication the footer has a clear:both on it. Post a link.

**WebJoel** · #3 07-07-2007, 01:49 PM

You can also reduce this:

background: white;
background-image: url('camback.jpg') ;

to just:

background: white url('camback.jpg') ;

saves some typing, easier to read/edit later, smaller code.

jagguy · #4 07-07-2007, 08:20 PM

I can't get a footer after at bottom of the page. The problem is my maincontent area is dynamic in size although i have edited this out.
The footer appears to the left of maincontent and not at bottom.

Code:

...
div#headerWrapper {
         position:absolute;
         top:5px;
         left: 5px;
         background: #63625e ;
         width:1000px;
         height:120px;
         top:3px;
         left: 5px;
        border:2px  groove black;
 }
 
div#header  {
     position:relative;
     top:5px;
     left: 5px;
     width:990px;
     height:100px;
     background: black;

      border:5px  groove #63625e ;
 }
 
 

 
div#boxlayer1 {
	position:absolute;
	width:145px;
	height:700px;
	z-index:1;
	left: 5px;
	top: 125px;
    border:2px  groove black;
   // background: green;
    background-color:#63625e;
}

div#content1 {
	position:absolute;
	top:125px; /*border adds 2 px so i take them off*/
	left: 165px;
	width:850px;
	height:900px;
	z-index:1;
	border:5px groove #666862;

     background: black;

}

#footer {
   
     clear:both;
     float:none;
     width:200px;
     height:100px;
     background: red;

      border:5px  groove #63625e ;

}
.....

</head>

<body bgcolor="#666862">  <?php include("navigation2.php"); ?>
<div id="navlist">
<div id="headnavlist">Site Features</div>
<ul >
<li ><a href='login.php'>Upload</a></li>
<li><a href='home.php'>Home</a></li>
<li ><a href='login.php'>Send Mesage</a></li>

<li><a href='home.php'>Message Outbox</a></li>
<li ><a href='login.php'>Upload</a></li>
<li><a href='home.php'>Home</a></li>


<li><a href='home.php'>Message Outbox</a></li>
</ul>
</div>
</div>

<div id="content1" >
asfafas

</div> <br><br>
<div id="footer">
asdsa
</div>
</body>
</html>

**WebJoel** · #5 07-09-2007, 11:33 AM

Could we see your complete code (HTML & CSS)? Using your provided sample, I could reconstruct what I think you have, -but if it isn't, the advice may not apply.

Also, -the white-space inside of the tag might not be such a good thing:

Quote:

<ul >
<li ><a href='login.php'>Upload</a></li>
<li><a href='home.php'>Home</a></li>
<li ><a href='login.php'>Send Mesage</a></li>

<li><a href='home.php'>Message Outbox</a></li>
<li ><a href='login.php'>Upload</a></li>
<li><a href='home.php'>Home</a></li>

<li><a href='home.php'>Message Outbox</a></li>
</ul>

Doesn't seem to harm anything, but 'white-space bug on lists' for IE might cause a problem later on..

**ray326** · #6 07-09-2007, 04:04 PM

The absolute positioning is just adding to your woes, too. Try to rebuild it with floats.

Thread Tools	Search this Thread
Show Printable Version Email this Page	Search this Thread: Advanced Search
Display Modes	Rate This Thread
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode	Rate This Thread:

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)