Improve company productivity with a Business Account.Sign Up

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 249
  • Last Modified:

How do I keep a div at the bottom of the page

Hello CSS Experts

I have a div that contains a menu -- that I want to keep at the bottom of the pages.

I assume it has something to do with "absolute" or "relative" or something like that :)

In my next comment I will post a link to a test development page.

Looking forward to your excellent solution!

Thanks,

Rowby
0
Rowby Goren
Asked:
Rowby Goren
  • 4
  • 3
2 Solutions
 
Rowby GorenAuthor Commented:
Ok --

Here's the link to the Link to test pagetest page:

The bottom menu is near the bottom,  but I want it to be always at the bottom of the browser.  No space below it.

Thanks
0
 
GaryCommented:
You want it fixed to the bottom of the page?
Just add to div#FooterBlackBackground {}
bottom:0
0
 
Rowby GorenAuthor Commented:
Thanks Gary,

I added your code and that did the trick!

I was editing my last comment when I was prevented from editing it.

I wanted to add this one additional "requirement"....

If the main area has a lot of text, I need the text to scroll "behind" the bottom div/menu.

Like on this page  Example of text rolling "behind" the bottom div/menu
0
What Kind of Coding Program is Right for You?

There are many ways to learn to code these days. From coding bootcamps like Flatiron School to online courses to totally free beginner resources. The best way to learn to code depends on many factors, but the most important one is you. See what course is best for you.

 
GaryCommented:
That's what should be happening, do you have an example page where it isn't?
0
 
Rowby GorenAuthor Commented:
Ah --- you're right.  I added text to the test page and it is indeed going behind the div.

Anything else I should know before I award the points?

Maybe centering the menu, while you're at it?

Thanks!
0
 
GaryCommented:
Ahh here now!

Add to the same class above
text-align: center;
0
 
Rowby GorenAuthor Commented:
Thanks Gary!

Now I can go to sleep! :)

Rowby
0
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

Featured Post

Get 10% Off Your First Squarespace Website

Ready to showcase your work, publish content or promote your business online? With Squarespace’s award-winning templates and 24/7 customer service, getting started is simple. Head to Squarespace.com and use offer code ‘EXPERTS’ to get 10% off your first purchase.

  • 4
  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now