MVC ClientSideValidation using Inline Style?

Got a simple form, and I am using the data annotations and model to give automatic clientside validation. However it looks fairly rubbish, and although I can apply some CSS to the elements im finding it quite difficult to get them to display as tooltip style errors.

Ideally im after something like: http://www.position-relative.net/creation/formValidator/demoValidators.html

However it seems like all these sort of implementations require new DOM elements to be add开发者_StackOverflow社区ed during the validation and then displayed, however by default we only have the single element that contains the validation message.

I was mainly wondering if there was any pre-made Jquery plugin or MVC compatible project that would allow me to do this style of validation with little effort, as im a coder not a designer.

If there is no simple way to do this then no worries, and thanks for any advice!

I have validation similar to the demo URL that uses MVC validation and css - it's not too difficult to do - my CSS looks like this:

.field-validation-error
{
    background:url('/Styles/icons/validation-box-medium.gif') no-repeat;
    padding:10px 4px 4px 28px;
    width:188px;
    height:20px;
    position:absolute;
    z-index:1;
    clear:both;
    color:#780701;
}

And my view code looks like:

            <div>
                <div class="editor-label">
                    <%: Html.LabelRequiredFor(model => model.Product.Price)%>
                </div>
                <div class="editor-field">
                    <%: Html.TextBoxTwoDecimalFor(model => model.Product.Price)%>
                    <div style="clear:both;"></div>
                    <%= Html.ValidationMessageFor(model => model.Product.Price)%>
                </div>
            </div>

I have a CSS class for the "clear:both" i.e. I never us inline styles - but for the sake of the example I have omitted that.

You're welcome to use some or all of the contents of this post including the image :-)