anchor.diff:                  tips.removeClass( "ui-state-highlight", 1500 );
               }, 500 );
           }
  -
  +        function checkLength( field, fieldName, min, max ) {
  +            if ( field.val().trim().length > max || field.val().length < min ) {
  +                field.addClass( "ui-state-error" );
  +                updateTips( "Length of the " + fieldName + " field must be between " +
  +                        min + " and " + max + " characters." );
  +                return false;
  +            } else {
  +                return true;
  +            }
  +        }
           function checkRegexp( field, regexp, example ) {
               if ( !( regexp.test( field.val() ) ) ) {
                   field.addClass( "ui-state-error" );
  
positive.code:     <a href="/gxa">Atlas baseline homepage</a>
  </div>
  
  <div id="dialog-form" title="Send Feedback">
  
      <div class="validateTips">All form fields are required.</div>
  
      <form>
          <fieldset id="form-fields">
              <ul>
                  <li>
                      <label for="whatWereYouDoing">What were you trying to do</label>
                      <textarea rows="2" cols="50"  name="whatWereYouDoing" id="whatWereYouDoing" class="text ui-widget-content ui-corner-all">
                      </textarea>
                  </li>
                  <li>
                      <label for="whatWentWrong">What went wrong</label>
                      <textarea rows="2" cols="50"  name="whatWentWrong" id="whatWentWrong" value="" class="text ui-widget-content ui-corner-all" >
                      </textarea>
                  </li>
                  <li>
                      <label for="whatCouldBeBetter">What could be better</label>
                      <textarea rows="2" cols="50"  name="whatCouldBeBetter" id="whatCouldBeBetter" value="" class="text ui-widget-content ui-corner-all" >
                      </textarea>
                  </li>
                  <li>
                      <label for="email">Your email address</label>
                      <input type="input" size="50" name="email" id="email" value="" class="text ui-widget-content ui-corner-all" />
                  </li>
              </ul>
          </fieldset>
  
negative.code: 
  <style>
      fieldset { padding:0; border:0; margin-top:0px; }
      .ui-dialog .ui-state-error { padding: .3em; }
      li {padding-bottom: 4px; }
      .validateTips { border: 1px solid transparent; padding: 0em; }
  </style>
  <script>
      $(function() {
          var feedback = $( "#feedback" ),
              email = $( "#email" ),
              allFields = $( [] ).add( feedback ).add( email ),
              tips = $( ".validateTips" );
  
          function updateTips( text ) {
  