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">
4 Years
Discussion Span
Last Post by João_5

Try using a button element in the form.

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

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">

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

Edited by dany12


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">

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-->

<!--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


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>

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

    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..

Edited by Nimerion


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


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

Edited by JorgeM: Link remove. Please, use the signature tool in your profile.


This works for me:

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

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.