Tableless form layout


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



Copy this code and paste it in your HTML
  1. <style>
  2. p label {
  3. float: left;
  4. margin-right: 10px;
  5. text-align: left;
  6. width: 100px;
  7. }
  8.  
  9. p input[type="submit"] {
  10. margin-left: 110px;
  11. }
  12. </style>
  13.  
  14. <form method="post" action="#">
  15. <p><label for="strName">Name</label>
  16. <input type="text" id="strName" name="strName" />
  17. </p>
  18. <p><label for="strEmail">Email address</label>
  19. <input type="text" id="strEmail" name="strEmail" />
  20. </p>
  21. <p><label for="strPhone">Phone Number</label>
  22. <input type="text" id="strPhone" name="strPhone" />
  23. </p>
  24. <p><label for="strComments">Comments</label>
  25. <textarea id="strComments" name="strComments" /></textarea>
  26. </p>
  27. <p><input type="submit" value="Send" /></p>
  28. </form>

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.