dropdown form in pure css with a tricky right alignment

Question

I want to make a form only visible if the mouse is hovering an image.

I made a fiddle for it: http://jsfiddle.net/SoonDead/WScEP/

Here is what I'm trying to achieve:

The wrapper has a fixed width, the picture also has a fixed width, but the dropdown has a varying width.

I want to right align the dropdown form, just like the .cart-button picture.

This should not be so difficult but I'm pulling my hair out over this.

Answer 1

Something like this?

http://jsfiddle.net/WScEP/4/

Answer 2

Maybe this is what you're after: http://jsfiddle.net/peduarte/WScEP/6/

I have added comments in the CSS section with what's been added.