Hello all,

Similar to what was discussed in one of my previous threads here, I would like to utilize the same concept for the e-mail submission box, in anticipation that the visitor may have images turned off in their browser; however, this would be going over a form element, and there seems to be a bit more than an anchor that has a span over it.

This is the markup for the form:
Code:
 <form id="emailbox" name="form1" method="post" action="">
        <div>
          <input type="text" name="go" id="go" value="your e-mail" onclick="input_focus(this)"  onblur="input_reset(this)"/>
          <input type="submit" value="Join" />
        </div>
      </form>
I would like to put some text under the image somehow, so that it will be displayed if the images are turned off. Thinking back on the previous thread, this is the technique utilized:

Code:
<h3 id="sectionhomelink"><a alt="Home Page" title="Go to the Home Page." href="index.html">Back to Home Page<span></span></a></h3>
Code:
h3#sectionhomelink{
	height:48px;
  	position:relative;
    width:360px;
}
#sectionhomelink a{
    height:48px;
    width:360px;
}
#sectionhomelink a:hover, #sectionhomelink a:active, #sectionhomelink a:focus{color:#FC6; text-decoration:none;}
#sectionhomelink span{
	background:url("sectionhomelink.gif") no-repeat 0 0;
	height:48px;
	position:absolute;
	width:360px;
	top:0;
	left:0;
}
#sectionhomelink a:hover span{
	background-position:0 -48px;
	height:48px;
	width:360px;
}
/* positioning the link */
#sectionhomelink{margin-top:5px; padding-right:10px; float:right;}
Thanks for your insight.