Beautiful .Net Form Validation

Bet you never thought you'd see those words together, but that's what I've done with the following example of an entry form, albeit just one field for simplicity, in .Net:

<style type="text/css">
.field {
    position:relative; 
    width:600px;
    padding-bottom: 20px;
}
.error {
    position:absolute; 
    top:18px; 
    right:0px;
    z-index:1;
}
.errorTip {
    background: url(images/errTip.png) no-repeat;
    width: 234px;
    height: 40px;
    color: white;
    padding: 6px 0 0 25px;
    text-align: left;
    font-size: 15px;
}
</style>

<form ID="Form1" runat="server">
<div class="field">
    <label><span>*</span>Company Name:</label>
    <asp:TextBox ID="txtCompany" runat="server" 
     style="width:390px;" MaxLength="150" />
     <div class="error" style="left:400px">
         <asp:RequiredFieldValidator ID="RequiredFieldValidator1" 
           ControlToValidate="txtCompany" ValidationGroup="Register" 
           SetFocusOnError="true" runat="server">
             <div class="errorTip">Enter your company name</div>
         </asp:RequiredFieldValidator>
     </div>
 </div>
 </form>

The "errorTip" div has a background image like (mine is a bit prettier than this):

and is displayed in the RequiredFieldValidator with the appropriate error message positioned on top of it.

The "error" div positions the validator to the right edge of the input box, and the outer "field" div helps set up the position and width of the whole thing.

I may put a real example up, but for now; repeat as needed for each field on the form, and bake into your next website.