[Home]Custom buttons

HomePage | RecentChanges | Preferences | Newbie Help

Category HTML Forms

http://www.htmlhelp.com/faq/html/all.html#custom-button

brucie points out a CSS way of doing it (rather neat IMO)

 <style type="text/css">
 .submitbutton{
   background-image : url(an_image.gif);
   border-width : 0px;
   width : 150px;
   height : 50px;
 }
 .resetbutton{
   background-image : url(an_image.gif);
   border-width : 0px;
   width : 150px;
   height : 50px;
 }
 </style>
 <form>
  <input type="submit" class="submitbutton" name="demo1" 
  value="Submit">
  <input type="reset" class="resetbutton" name="demo2" 
  value="Reset">
 </form>


Comments --

It's a neat trick, I took it a bit further a while ago: http://gutfeldt.ch/matthias/articles/styleforms/styletemplate.php?incl=3 . As a bonus, this even has a :hover and :focus stylesheet. Remember that stuff like this only works in a select few browsers, so YMMV. Matthias


HomePage | RecentChanges | Preferences | Newbie Help
This page is read-only | View other revisions
Last edited March 15, 2002 8:51 am (diff)
Search:

This FAQ is happily hosted by Betadome Digital Media