How to Create a Sub Form with Image

[jlucero]

I have created an image that I would like to use as a subscription form in a widget. How to get the input box to line up properly? I am using the Mocha theme and would like to have the subscription box show up in the widgetized area of the heading. I have been able to create the form with the image, but like I said, the input box doesn't line up.
Thanks,
Jasmine

[NicktheGeek]

Please post a link to your site

[jlucero]

Http://www.ponderthepath.com

[NicktheGeek]

where is your form at?

[jlucero]

I don't have it on there because it wasn't working. Here is the code I was using, trying with absolute values to position it. Then I realized that because the theme is responsive it moves (I am new to this).

<div align="right">
<form name="FeedBlitz_6e71dfafb43a11e19f67003005ce8903" method="POST" action="http://www.feedblitz.com/f/f.fbz?AddNewUserDirect" style='background-image:url(http://ponderthepath.com/wp-content/...ubscribe.png); height:150px; width:300px;'>

<input style="display:none; position:absolute; top:190px; right:245px" name="EMAIL" maxlength="70" type="text" size="21" value="" >

<input name="EMAIL_" maxlength="70" type="hidden" size="20" value="email address">

<input name="EMAIL_ADDRESS" maxlength="70" type="hidden" size="20" value="email address">

<input name="FEEDID" type="hidden" value="838008">
<input name="PUBLISHER" type="hidden" value="26589446">

<input type="button" value="Subscribe!" style="position:absolute; top:185px; right:145px;" onClick="FeedBlitz_6e71dfafb43a11e19f67003005ce890 3s(this.form);">

</form>


<script language="Javascript">function FeedBlitz_6e71dfafb43a11e19f67003005ce8903i(){var x=document.getElementsByName('FeedBlitz_6e71dfafb4 3a11e19f67003005ce8903');for(i=0;i<x.length;i++){x[i].EMAIL.style.display='block';
x[i].action='http://www.feedblitz.com/f/f.fbz?AddNewUserDirect';}}
function FeedBlitz_6e71dfafb43a11e19f67003005ce8903s(v){v.s ubmit();}FeedBlitz_6e71dfafb43a11e19f67003005ce890 3i();</script></div>

[NicktheGeek]

in the style for the <form> element, add position: relative;

This will let the absolute value measure against your form not some other element.

[jlucero]

Do I keep the position: absolute for the <input>style?

[NicktheGeek]

if you are trying to position it absolutely, then yes.