midrange.com code scratchpad
Name:
css_positioning.html
Scriptlanguage:
Plain Text
Tabwidth:
4
Date:
06/05/2008 06:34:03 pm
IP:
Logged
Description:
Shows how to position fields with properties vs. using HTML tables, tr, and td tags.
Code:
  1. <html>
  2. <head>
  3. <style type="css">
  4.     p.lblFld {
  5.     clear: both;
  6.     float: none;
  7.     position: relative;
  8.     }
  9.     
  10. p.lblFld input {
  11.   clear: left;
  12.   float: left;
  13.   margin-left: 80px;
  14.     }
  15.         
  16. p.lblFld label {
  17.   clear: left;
  18.   display: block;
  19.   float: left;
  20.   margin-left: 10px;
  21.   width: 200px;
  22.     }
  23. </style>
  24.  
  25. </head>
  26.  
  27. <body>
  28.  
  29. <div id="screen1">    
  30.   <p class="lblFld">
  31.     <label for="cust_fnam">First Name</label>
  32.     <input type="text" id="cust_fnam" />
  33.   </p>
  34.   <p class="lblFld">
  35.     <label for="cust_lnam">Last Name</label>
  36.     <input type="text" id="cust_lnam" />
  37.   </p>  
  38.   <p class="lblFld">
  39.     <label for="cust_acct">Account</label>
  40.     <input type="text" id="cust_acct" />
  41.   </p>   
  42.     
  43. </div>
  44.  
  45.  
  46. </body>
  47. </html>
© 2004-2019 by midrange.com generated in 0.005s valid xhtml & css