Solved

css div at bottom of page

Posted on 2008-10-26
2
404 Views
Last Modified: 2008-10-26
I have a div which needs to be placed beneath another div.
but for some reason they move side by side.

<div id="wrapper">content</div>
<div id="footer">content</div>


#wrapper
{
	padding: 0px;
	margin-top: 11px;
	margin-bottom: 0px;
	margin-right: auto;
	margin-left: auto;
	text-align:left;
	width: 715px;
	voice-family: "\"}\"";
	voice-family:inherit;
	width: 715px;
}
#footer
{
	overflow:hidden;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #666666;
	text-decoration: none;
	text-align: center;
	padding:0px;
	width:720px;
	voice-family: "\"}\"";
	voice-family:inherit;
	width:720px;
	float: none;
	margin: 0px;
	height: 34px;
	border: 1px solid #FF0000;
}

Open in new window

0
Comment
Question by:Cheryl Lander
2 Comments
 
LVL 82

Accepted Solution

by:
hielo earned 400 total points
ID: 22809417
add:

clear:both;

to your #footer{...} definition
0
 
LVL 44

Assisted Solution

by:scrathcyboy
scrathcyboy earned 100 total points
ID: 22809438
<div id="wrapper">content</div>
<BR />
<div id="footer" style="clear:both;">content</div>

The <BR> is guaranteed to put the footer on a line below the wrapper, and the clear:both style FIXES the footer in the page relative to the other DIV and other elements.
0

Featured Post

Master Your Team's Linux and Cloud Stack

Come see why top tech companies like Mailchimp and Media Temple use Linux Academy to build their employee training programs.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

CSS is a visual language used to classify objects and define rules about how they should be displayed. CSS skills aren’t restricted to developers anymore, there is a big benefit to having a basic understanding of the language, regardless of your occ…
This article discusses how to create an extensible mechanism for linked drop downs.
The viewer will the learn the benefit of plain text editors and code an HTML5 based template for use in further tutorials.
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.

773 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question