using: jquery validator
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.js"></script>
<div>
<form id="everything">
<label for="dd1">Select the best option</label>
<br/>
<select name="dd1" id="dd1" class="required">
<option value="">None</option>
<option value="o1">option 1</option>
<option value="o2">option 2</option>
<option value="o3">option 3</option>
</select>
<br/>
<br/>
<label for='agreement'>I accept the TOS</label>
<input id="agreement" name="agreement" type="checkbox" style='float:left' />
<br/>
<input type="submit" />
</div>
</form>
I'm trying to figure out how to change the position of one of the error messages and leave the rest where they are. I know you can use ErrorPlacement to achieve this but I'm having a difficult time figuring out how to do it.
I've seen an example Custom Error Label Placement using jQuery validate (For all or some of your errors)
and created http://jsfiddle.net/Kn3v5/215/
I want to adjust 1. change the color of "Accept the TOS" to 2E0854. 2. move the error to 10px from the left.
what am I doing wrong?
thanks as always for the help much appreciated.
Simply remove/fix your top - bottom margins: http://jsfiddle.net/Kn3v5/219/
#everything label.error {
color: #FB3A3A;
display: inline-block;
margin: 0px 10px 0px 60px; /* Top and Bottom to '0' */
padding: 0;
text-align: left;
width: 320px;
}
#everything2 label.error {
color: #2E0854;
margin: 0px 10px 0px 10px; /* Top and Bottom to '0' */
}
Additionally you have an extra </div>
inside your form