Jump to content

align form fields


Destramic

Recommended Posts

i found this align label script which should align your form fields in a straigh flushed column...i'm very new to this jquery...does anyone know of a way to get this working or maybe a better tutorial/script

 

thank you

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>align form</title>
    <style type="text/css">

    </style>
    <script type="text/javascript">
    
    jQuery.fn.autoWidth = function(options) 
    { 
      var settings = { 
            limitWidth   : false 
      } 
       
      if(options) { 
            jQuery.extend(settings, options); 
        }; 
         
        var maxWidth = 0; 
       
      this.each(function(){ 
            if ($(this).width() > maxWidth){ 
              if(settings.limitWidth && maxWidth >= settings.limitWidth) { 
                maxWidth = settings.limitWidth; 
              } else { 
                maxWidth = $(this).width(); 
              } 
            } 
      });   
       
      this.width(maxWidth); 
    } 

    $('label').autoWidth({limitWidth: 350}); 
    
    </script>
</head>
<body>
    <label for="a_field">name :</label> <input id="a_field" name="a_field" type="text" /> <br/>
    <label for="a_field">e-mail address :</label> <input id="a_field" name="a_field" type="text" /><br/>
    <label for="a_field">number :</label> <input id="a_field" name="a_field" type="text" /> <br/>
    <label for="a_field">postcode :</label> <input id="a_field" name="a_field" type="text" /> <br/>
    <button id="btnNothingToDo">Do nothing</button>
  </body>
</html>

Link to comment
https://forums.phpfreaks.com/topic/201087-align-form-fields/
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.