Positioning help!!

[pookeyblow]

I want to have a little box (png image) in the down left corner of my site. I got it to work, but wanted a hover effect so I tried to do it with CSS instead.

Now I have problems positioning my div where I want it. It's where I want it horizontal wise, but not vertically.. I'm sur I'm doing something wrong with the bottom: 0px;....

Link to the site I'm working on: http://bit.ly/297LCa

I also want to add a <a href="#"> to it.. how do I do that? Right now it doesn't work.

And it also seems like the bg image in the div won't show up unless I add some content into my div?


hope anyone can help me.. I know it should be very easy!

thanks

[Medyman]

How exactly do you want it positioned? Your basic method is correct. Just play around with values to the bottom property. It takes positive and negative numbers depending on the direction you want to move it.

As far as a link: I assume you want the image to be a link. The way I would do it is to make the image the background of the link and then change it on hover. For example:

a.up {
  display:block;
  height:48px;
  width:48px;
  background: #FFF url(up.png) no-repeat top center;
}

a.up:hover {
  background-image: url(down.png);
}

<div>
  <a href="#">&nbsp;</a>
</div>