Advanced Search

Simple Form Search Box

/ Published in: HTML
Save to your folder(s)
Very simple form search box
Here for play coded http://undercover-blogger.blogspot.com/p/html-editor.html

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. CSS Coded
  2.  
  3. <style>
  4. .search { 
  5. width: 260px; 
  6. padding: 0 10px; 
  7. height: 42px; 
  8. background: #8CDAF8; 
  9. }
  10. .search .searchform { 
  11. margin:7px 0; 
  12. display: inline; 
  13. height:29px; 
  14. }
  15. .search .searchbutton {
  16. 	margin: 8px 0 0 0;
  17. 	background: #777;
  18. 	width:30px;
  19. 	height:26px;
  20. 	font: normal 14px/14px 'Trebuchet MS', sans-serif;
  21. 	color:#FFF;
  22. 	border: 0;
  23. }
  24. .search .searchbx {
  25. 	font: italic normal 15px/15px Georgia, serif;
  26. 	color: #555;
  27. 	border: none !important;
  28. 	height: 20px;
  29. 	width: 226px;
  30. 	padding: 0 0 3px;
  31. 	background-color: transparent !important;
  32. }
  33. </style>
  34.  
  35. Markup HTML
  36.  
  37. <div class="search">
  38. <form class="searchform" action="http://undercover-blogger.blogspot.com/search" method="get" target="top">
  39. <input name="q" type="text" class="searchbx" size="" placeholder="Type here to search..." />
  40. <input type="submit" class="searchbutton" value="OK" />
  41. </form>
  42. </div>

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.