how to add image in form submit bouton ???

[chrisschristou]

hello dear friends
i'm trying to insert picture in form subtmit bouton but it don't show anything on navigator this is the way i do it

<input name="adcart" type="submit" src="product/images/shopping-cart-icons.png"  class="boutonaddto" id="adcart" value="ADD TO BASKET">

[JorgeM]

Try using a button element in the form.

 <button type="submit" name="btn1" value="clicked"><img src="#" /></button>

[chrisschristou]

like this one it don't work

<input name="adcart" type="submit" <img src="product/images/shopping-cart-icons.png"class="boutonaddto" id="adcart" value="ADD TO CART">

[JorgeM]

Did you try using a button element instead like the example I posted above?

[dany12]

Your example doesn't work because you have a <input>element open and add a nother element in that this is identically to this <div <span> <form>>,this is not a valid syntax.
Web consortium have created this method and this method alone to add images to buttons
<button><img src="path/to/image"/></button>
I hope you understand now why your method doesn't work

[chrisschristou]

my syntax is diferent with this you give in up exemple, how i can mix it ???

<input name="adcart" type="submit" class="boutonaddto" id="adcart" value="ADD TO CART">

[dany12]

You have a

<input> <!--tag open and then you use -->

<input <img> ><!--syntax error-->

<!--You can't mix input with the type button with img -->

<!--That is why you always use-->
<button><img/></button>

<!--You can't use an  open element and then open another than close them both-->

<!--This is the way HTML and XHTML WORK-->

Hope you understand now

[chrisschristou]

hello friends , it work but i would like to have text near to the picture but i don't know how

<button type="submit" class="boutonaddto" name="adcart" value="ADD TO CART"><img src="images/shopping-cart-icons.png" width="38" height="31" /></button>

[Nimerion]

Try w3schools..
I would use an css class to set the background:

.btnClass{
    background: url(the image) no-repeat;
    width: Xpx;
    height: Ypx;
}

Then in my html:

<input type="button" name="adcart" value="add to cart" class="btnClass" />

Haven't touched web development soon..
I program in C++, I hope I've helped enough..

[cmps]

Hello, just use a normal
<input name="submit" value="Submit" style="border:none; background-image:url(...); width:...px; height:...px; text-align:right; padding-right:2px;">
remove 2px from the width since we added them as padding-right.
I think you got the idea, try it and tell me

[mugheesahmed]

Use This It Will Help You
<button type="submit" name="btn1" value="clicked"><img src="#" /></button>

[mattster]

Or has anyone thought of in "image" input?

http://www.w3schools.com/tags/tryit.asp?filename=tryhtml5_input_type_image

[João_5]

This works for me:

<INPUT alt="Submit" src="images/image.png" width="48" height="48" type="image">