Improve company productivity with a Business Account.Sign Up

x
?
Solved

Align div to bottom immediately after other divs

Posted on 2008-10-07
2
Medium Priority
?
899 Views
Last Modified: 2012-05-05
Hey Experts!!
I have a page (URL above) in which I want to put a footer IMMEDIATELY following the content div.  Basically where the #footer div is placed directly below the #content div

How can I do this so that my background image shows in all browsers?????

Relevant CSS below  
#content {
	position:absolute;
	width:800px;
	height:auto;
	z-index:auto;
	margin-right: auto;
	margin-left: auto;
	padding: 6px;
	left: 25%;
	top: 207px;
	right: 25%;
	background-color: #FFFFFF;
	background-attachment: fixed;
	background-image: url(../images/bottom_round.jpg);
	background-repeat: no-repeat;
	background-position: center bottom;
}
 
#footer    {
	position: absolute;
	bottom: 1%;
	width: 815px;
	clear: both;
	left: 25%;
	right: 25%;
	height: 26px;
	background-attachment: fixed;
	background-image: url(../images/bottom_round.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	background-color: #FFFFFF;
    }

Open in new window

0
Comment
Question by:LZ1
2 Comments
 
LVL 13

Accepted Solution

by:
Onthrax earned 2000 total points
ID: 22666987
Replace your footer part with this:

    <div id="footer">
      <div align="center">
        <p>&copy; 2008 MadCups</p>
      </div>
      <div style="position: absolute; margin-left:-6px;"><img src="../images/bottom_round.jpg" width="815" height="33" /></div>
    </div>

0
 
LVL 30

Author Closing Comment

by:LZ1
ID: 31504088
Worked great!  Thanks!!
0

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.
There's never been a better time to become a computer scientist. Employment growth in the field is expected to reach 22% overall by 2020, and if you want to get in on the action, it’s a good idea to think about at least minoring in computer science …
In this tutorial viewers will learn how to embed custom externally-hosted Google Fonts using the Google Font API in CSS Go to the Google Fonts website at google.com/fonts: Browse or search based on font properties or name to find a suitable font for…
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

606 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