Unstoppable Domains

Vertical align bottom in css?

Spaceship Spaceship
Watch

vlad230

VIP Member
Impact
15
Hi guys!

I would like to display an image (button) at the bottom of a div and I can't seem to find the way to do it.

This is my css code:

Code:
#Container { width: 1000px; margin: 20px auto }
.button { position:absolute; vertical-align: bottom; padding: 10px 10px 5px 10px }
#ArticlesContainer { float:left; width: 580px; height: 250px; background-image: url(images/articles.gif); background-repeat:no-repeat; margin-left: 5px; margin-right: 10px; margin-top: 20px }
.articles {text-align:justify; padding: 5px 5px 5px 5px }

I use it like this:
Code:
<body>
<div id="Container">
      <div id="ArticlesContainer">
                    <div class="articles">Some text here...</div>
                    <div class="button"><img src....></div>
      </div>
</div>
</body>

The code that I have right now will display the image at the bottom of "Some text here..." but I want it to be positioned at the base of the ArticleContainer div id without taking into account the amount of text written.

Like this:
Code:
-----------------------
| Some text here..          |
|                           |
|                           |
|                           |
|                           |
|                     image |
------------------------

Any ideas?

- Vlad
 
0
•••
The views expressed on this page by users and staff are their own, not those of NamePros.
Unstoppable DomainsUnstoppable Domains
I think that vertical-align: bottom doesn't work on all browsers, try bottom :0px; right: 0px;

for button
 
0
•••
can't you just use another div...?
 
0
•••

We're social

Unstoppable Domains
Domain Recover
DomainEasy — Payment Flexibility
  • The sidebar remains visible by scrolling at a speed relative to the page’s height.
Back