How to place input field on top of image - html

Question

I have certain field as a table data which i converted from psd to html.
The image is shown below ..
Part of html code is ...
<tr>
<td colspan="13">
<img src="images/WebDesign_32.png" width="1200" height="24" alt="" class="texxt"></td>
<td>
<img src="images/spacer.gif" width="1" height="24" alt=""></td>
</tr>
<tr>
How to get text from top of this src="images/WebDesign_32.png" text using a form.

Answer 1

Try this code
.form-wrapper {
width: 400px;
display:block;
margin: 0 auto;
}
.form-wrapper .form-field {
width: 100%;
display: block;
margin-bottom: 15px;
}
.form-wrapper .form-field label {
display: block;
float: left;
min-width: 100px;
font-weight: bold;
}
.form-wrapper .form-field input,
.form-wrapper .form-field email,
.form-wrapper .form-field textarea {
width: 200px;
background: #c9cdd7;
border: none;
line-height: 20px;
margin-left: 20px;
resize: none;
}
.form-wrapper .form-field .submit-btn {
width:100px;
float:right;
background: #1949cb;
font-weight: bold;
}
<div class="form-wrapper">
<form>
<div class="form-field">
<label for="name">Name</label>
<input type="text" />
</div>
<div class="form-field">
<label for="email">Email</label>
<input type="email" />
</div>
<div class="form-field">
<label for="telephone">Telephone</label>
<input type="text" />
</div>
<div class="form-field">
<label for="message">Message</label>
<textarea></textarea>
</div>
<div class="form-field">
<input type="submit" class="submit-btn">
</div>
</form>
</div>