Jump to content


Photo

Use Css Button As Submit Button


  • This topic is locked This topic is locked
1 reply to this topic

#1 markdj

markdj

    RAGE Newbie

  • RAGE Members
  • Pip
  • 4 posts

Posted 10 December 2009 - 10:02 PM

How can I use a CSS button as a submit button (<input> tag) instead of a link (<a href> tag)?

#2 markdj

markdj

    RAGE Newbie

  • RAGE Members
  • Pip
  • 4 posts

Posted 14 December 2009 - 02:32 PM

OK! I figured out how to do this.

1. Create a CSS button that is 100 pixels wide. I did so in a file called yellowbuttons.png. The file actually has three buttons in it, one for each state - normal, hover, pressed.

2. Then create the following CSS file;

button {
background: url(yellowbutton.png) no-repeat;
font-family: 'Lucida Handwriting', 'Verdana';
font-size:14px;
height: 33px;
width: 100px;
border: none;
}

button:hover {
background: url(yellowbutton.png) -100px 0 no-repeat;
cursor : pointer;
}

button:active {
background: url(yellowbutton.png) -200px 0 no-repeat;
}

3. Then use the following html code:

<button type=submit width="100">Login</button>




0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users