The following HTML is a validation at the end of a form to prevent spam. It looks like the image attached.
HTML Code:
<fieldset>
<legend>Validate Your Message <span class="errors">Error message here<?php echo $visitorcodeErr ?></span></legend>
<span class="required">Required</span>
<center>
<img src="randomImage.php" alt="Captcha Image"/>
<input type="text" name="visitorcode" class="data" size="6" />
<!--Refresh Validate Code Button Facility-->
<a href><img src="refresh.jpg" onclick="history.go()" alt="Refresh Code" /></a>
</center>
</fieldset>
Seeking to activate the refresh image as a sprite using the css control below.
Code:
/*Refresh Validate Code Rollover*/
#flip {border: 0px; font-size: 0px; width: 35px; height: 35px;}
#flip a {background: url(./refresh.jpg); display: block; width: 35px;height: 35px;}
#flip a.link {background-position: 0px 0px;}
#flip a.link:hover {background-position: 0 bottom;}
The rollover works in a normal <div>. Have tried the <div> within the fieldset but positioning is then out. Is there a work around or diff approach?
Bookmarks