How to add a background image to the bottom of a div with auto expanding height

I have a side div that contains a vertical navigation ul which will will hav开发者_C百科e varying amount of content on every page.

Basically, I want to add an image to the bottom of the div which I want to be able to auto expand depending on the amount of content it contains.

How do I do this?

Thanks

---

You could place a div that contains the image inside your navigation div so that image would always be located at the bottom of the div and then apply this css

  .navImg{
      width: 100%;          
      position: absolute;          
      top: 0;
      left: 0;  }


<div id="navigation">
  //navigation ul
<div class="navImg"></div>
</div>

---

Assuming you can set this image as a background, then you could look into background-position.

For example:

background-position: center bottom;

---

#menu
{
  float:left;
  width:50px;
  border:1px solid black;
  padding:10px;
  background:black url(http://tinyurl.com/3brzfja) repeat-x center bottom;
}

• jsFiddle.net Example