Custom submit button

[kurt.santo]

Would like to use a custom submit button (using the following code):

   <form action="#"><input name="email" type="text" /><input name="submit" type="submit" src="content/go.gif"/></form>

, but it still displays the standard button and even places the button underneath the input box (would like to have it next to it). Any ideas?Kurt

[Synook]

You can have

<form action="#" name="myform"><input name="email" type="text" /><img src="content/go.gif" onclick="document.myform.submit()" /></form>

Basically, anything with onclick can be set to submit the form, just call the submit() method on the form.

[kurt.santo]

You can have

#competition form	{					height:22px;					padding:0px;					margin:0px;					}				#competition input	{					padding: 0px;					margin: 0px 5px 0px 0px;					vertical-align:top;					}					#competition img	{					padding: 0px;					margin: 0px;					vertical-align:top;					}

Any ideas why images might line up differently to input boxes?Kurt

[justsomeguy]

You can have

<form action="#" name="myform"><input name="email" type="text" /><img src="content/go.gif" onclick="document.myform.submit()" /></form>

Basically, anything with onclick can be set to submit the form, just call the submit() method on the form.

You don't even need to do that, there's already an image submit button.<input type="image" src="content/go.gif">

[kurt.santo]

You don't even need to do that, there's already an image submit button.<input type="image" src="content/go.gif">

Justsomeguy, I also tried your given example. But then the go-button is completely disaligned with the text box. Why is that? Would like to have the button vertically in the middle of the text box...Kurt

[Synook]

You mean it is to the left? Try using text-align:center; on the parent element (e.g. a container div).

[kurt.santo]

You mean it is to the left? Try using text-align:center; on the parent element (e.g. a container div).

Synook,I mean the vertical alignment. Applied a padding to the left of the input box (button is next to that), so that has been taken care of. It is just that the go button somehow does not want to vertical-align to the middle (meaning the middle of the text box)...Kurt

[justsomeguy]

One of the CSS rules is vertically aligning it to the top.

[kurt.santo]

One of the CSS rules is vertically aligning it to the top.

I know... This is just because this is the only way to kind of align it almost acceptable...Kurt