Textbox over Image in ASP.NET

How can I go about placing a textbox over a header image that is not set as a background image. If I play with the margins I can push the text back over the image but it will not work the same way with a textbox.
<div id="mainbar"><img src="images/contentpageheader.jpg" alt="" />
    <div class="typeface-js"><h2>Careers</h2></div>
    <br /><br /><br />
    <div class="content">
        <div class="typeface-js" id="font-expressway" style="color:#0d1e2b; font-size: 15px; margin-bottom: 10px; line-height: 18px; padding-top: 10px; ">Fill out the form below:</div>
        
        <div id="forml">
        <ul>
            <li class="typeface-js">Name:</li>
            <li class="typeface-js">Phone Number:</li>
            <li class="typeface-js">Email Address:</li>
            <li class="typeface-js">Description of Qualifications:</li>
        </ul>
        </div>
        
        <div id="formr">
        <ul>
        <li><asp:TextBox ID="TextBox1" runat="server"></asp:TextBox></li>
        <li><asp:TextBox ID="TextBox2" runat="server"></asp:TextBox></li>
        <li><asp:TextBox ID="TextBox3" runat="server"></asp:TextBox></li>
        <li><asp:TextBox ID="TextBox4" runat="server"></asp:TextBox></li>
        </ul>
        </div>
  
    </div>
    <div id="contentfooter"><img src="images/contentpagefooter.jpg" alt="" /></div>
</div>

Open in new window

WCCrobertAsked:
Who is Participating?
 
hehdaddyConnect With a Mentor Commented:
The only way I can think of off the top of my head (and this maybe wrong). Would be to set the textbox and possibly the imgage to position: relative inside a div. Then you could use z-index to put the textbox on top of the image and place it precisely where you want it.

Maybe give that a shot and see what happens.

Cheers.
0
 
CoveyCraigCommented:
You could use css instead.  Put this inside the <head> portion of your page.
<%
Response.Write      "<style type=""text/css"">" & vbNewLine & _
            "<!--" & vbNewLine & _
            ".textboxstyle {background-image:url(images/contentpageheader.jpg); background-color:" & strPageBgColor & "; background-repeat:no-repeat; background-position:center; background-attachment:scroll; font-family:" & strDefaultFontFace & ";font-size:10pt; overflow:auto;} " & vbNewLine &_
            "-->" & vbNewLine & _
            "</style>" & vbNewLine
%>

Then where you want a textbox with the background image, call it using 'textboxstyle' like this:

Response.Write      "<input type=""text"" name="whatever" class=""textboxstyle"">"
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.