Posted By

alozuldo on 09/10/10


Tagged

form css


Versions (?)

Who likes this?

3 people have marked this snippet as a favorite

alozuldo
Elog
satsuma


Simple XHTML Form with CSS


 / Published in: XHTML
 

URL: http://www.webcredible.co.uk/user-friendly-resources/css/css-forms.shtml

  1. -----------CSS-----------------
  2.  
  3. label {
  4. width: 4em;
  5. float: left;
  6. text-align: right;
  7. margin-right: 0.5em;
  8. display: block;
  9. }
  10.  
  11. .submit input {
  12. margin-left: 4.5em;
  13. }
  14. #form input:hover, #form textarea:hover{
  15. background-color: lightyellow;
  16. }
  17. input:focus, textarea:focus{
  18. background-color: lightyellow;
  19. }
  20.  
  21. -----------Form----------------
  22.  
  23. <form action="#">
  24. <p><label for="name">Name</label> <input type="text" id="name" /></p>
  25. <p><label for="e-mail">E-mail</label> <input type="text" id="e-mail" /></p>
  26. <p class="submit"><input type="submit" value="Submit" /></p>
  27. </form>

Report this snippet  

You need to login to post a comment.