By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
460,036 Members | 978 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 460,036 IT Pros & Developers. It's quick & easy.

How to set footer always at he bottom

P: 1
I have a page which should have a "sidebar" to the right, and a "main" block of content to the left. I want to represent each block as a <div>, and a footer always at the bottom of page no matter what the height of divs is.so any help?!
Mar 31 '11 #1
Share this Question
Share on Google+
5 Replies


JnrJnr
P: 88
Hi anthonymouallem, it depends on how big the body of your page is. Put the <div id = "footer"> at the bottom of all your <div>'s.

example:
if this is your body with its <div>'s...

Expand|Select|Wrap|Line Numbers
  1. <body>
  2.  
  3. <div id = "header">
  4. <div/>
  5.  
  6. <div id = "body">
  7. <div/>
  8.  
  9. <div id = "footer">
  10. <div/>
  11.  
  12. <body/>
Your CSS could look like this:

#footer
{
background-color: #FFCC00;
height: 50px;
margin-top: 30px;
margin-left: auto;
margin-right: auto;
margin-bottom: 0px;
}

pls mark as answer if it is
Apr 3 '11 #2

P: 3
sorry im new at this

should i add both the codes html and css ?
May 4 '11 #3

P: 3
Ok i added this but it's still at the middle of my page . i dint want to add the <br> in the middel of my text
May 4 '11 #4

JnrJnr
P: 88
Yes, you can either add the css code in a seperate style sheet file to allow easy style changes to all the pages or add css code to the same page as the html eg.
<head>
<style type="text/css">
.footer
{
background-color: #FFCC00;
height: 50px;
margin-top: 30px;
margin-left: auto;
margin-right: auto;
margin-bottom: 0px;
}
</style>
</head>
May 4 '11 #5

JnrJnr
P: 88
Can you give me a markup of what youv'e done and tell me what you want to do.
May 4 '11 #6

Post your reply

Sign in to post your reply or Sign up for a free account.