advanced code snippet search

Posted By

herrfischerhamburg on 05/17/11


Tagged

form css simple


Versions (?)

simple form

 / Published in: HTML
 
Expand | Embed | Plain Text 
  1. <!doctype html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8" />
  5. <title>...</title>
  6. <style type="text/css">
  7. body {
  8. 	background-color: #999;
  9. }
  10. #searchform {
  11. 	background:url(bilder/form-pic.png) 0 0 no-repeat;
  12. 	display:inline-block;
  13. 	width:400px;
  14. }
  15. #searchform label {
  16. 	display:none;
  17. }
  18. #theformfield {
  19. 	float:left;
  20. 	width:210px;
  21. 	border:none;
  22. 	background:none;
  23. 	height:40px;
  24. 	line-height:40px;
  25. 	padding-left:14px;
  26. 	padding-right:14px;
  27. 	padding-top:3px;
  28. 	color:#ccc;
  29. 	font: 16px bold Arial, Helvetica, sans-serif;
  30. }
  31. .thebutton {
  32. 	float:left;
  33. 	width:85px;
  34. 	height:40px;
  35. 	padding-top:2px;
  36. 	line-height:40px;
  37. 	cursor:pointer;
  38. 	border:none;
  39. 	background:none;
  40. 	color:#777;
  41. 	font: 14px bold Arial, Helvetica, sans-serif;
  42. }
  43. </style>
  44. </head>
  45. <body>
  46. <form action="#" method="post" target="_blank">
  47.   <div id="searchform" class="cf">
  48.     <div id="173753" rel="email">
  49.       <label>E-Mail:</label>
  50.       <input id="theformfield" 
  51.           name="email" 
  52.           type="text" 
  53.           value="Your Mail Adress" 
  54.           onFocus="if(this.value=='Your Mail Adress') 
  55.  this.value='';" 
  56.  onBlur="if(this.value=='') 
  57.  this.value='Your Mail Adress';">
  58.     </div>
  59.     <div id="173755" rel="button" class="thebutton">
  60.       <input type="submit" value="Send it!" class="thebutton">
  61.     </div>
  62.     <!--searchform--> 
  63.   </div>
  64. </form>
  65. </div>
  66. </body>
  67. </html>

Report this snippet  

You need to login to post a comment.