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:
I use it like this:
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:
Any ideas?
- Vlad
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





