Text box and button on a image in MVC using responsive web design

Question

I have to create an MVC web for my company and I'm using a responsive web design framework (Zurb Foundation). It works amazing. But my problem is I have an image in one of the divs and I need to add a textbox and a button into the image (basically it's a login). I wanted a kind of control, with the background image and then the html textbox/button, but not sure if this is possible in MVC.

I tried with css (position:absolute) but when I re-size the page to let the html adapts to the different browser sizes, it doesn't work.

How can I solve this problem?

Thanks.

Answer 1

Aaaah, I got it now.

You need to understand position for this.

Some information

An absolute positioned element in a relative positioned element...

jsfiddle

Just play some with the margin, breaks etc...