Advanced Search

Tableless forms

/ Published in: HTML
Save to your folder(s)

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. <fieldset>
  2. <legend>Sign-up Form</legend>
  3. <form name="signup" action="index.html" method="post">
  4. <ul>
  5. <li> <label for="name">Name</label>
  6. <input type="text" name="name" id="name" size="30" />
  7. </li>
  8. <li> <label for="email">Email</label>
  9. <input type="text" name="email" id="email" size="30" />
  10. </li>
  11.  
  12. <li> <label for="psw">Password</label>
  13. <input type="text" name="psw" id="psw" size="30" />
  14. </li>
  15.  
  16. <li> <label for="free">Free Subscrition</label>
  17. <input type="radio" name="subscription" id="free"/>
  18. </li>
  19.  
  20. <li> <label for="professional">Professional</label>
  21. <input type="radio" name="subscription" id="professional"/> </li>
  22.  
  23. <li>
  24. <label for="newsletter">Newsletter</label>
  25. <input type="checkbox" name="newsletter" id="newsletter"/>
  26. </li>
  27.  
  28. <li><label for="submit"></label>
  29. <button type="submit" id="submit">Send</button> </li>
  30. <ul>
  31. </form>
  32. </fieldset>
  33.  
  34.  
  35.  
  36. fieldset ul, fieldset li{
  37. border:0; margin:0; padding:0; list-style:none;
  38. }
  39. fieldset li{
  40. clear:both;
  41. list-style:none;
  42. padding-bottom:10px;
  43. }
  44.  
  45. fieldset input{
  46. float:left;
  47. }
  48. fieldset label{
  49. width:140px;
  50. float:left;
  51. }

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.