using jQuery to justify form elements
If you create a simple web form like in the example below：http://dl.iteye.com/upload/attachment/366476/985fa9ab-ccfc-3dd2-aae9-28aeafe7dad7.png
Usually, to make the all labels have the same width，you would set the width of labels to some number, let's say 100px. But, let's do another thing. Let's calculate the width of a largest label and apply it to all labels. jQuery function below does exactly what I wrote:
$(document).ready(function() { var max = 0; $("label").each(function(){ if ($(this).width() > max) max = $(this).width(); }); $("label").width(max);});
And visually it looks like this:
http://dl.iteye.com/upload/attachment/366478/d80e3f9e-1736-35a0-bac0-00089fab8e14.png
html source code：
<fieldset class="form_registro"> <label>name</label><input id="name" name="name"type="text" /><br/> <label>Email Address</label><input id="email" name="email"type="text" /><br/> </fieldset>
参：http://www.jankoatwarpspeed.com/post/2008/07/09/Justify-elements-using-jQuery-and-CSS.aspx
页:
[1]