2010-12-31 4 views
0

S'il vous plaît, aidez,Image CSS pour soumettre le bouton - le fait de cliquer sur l'image doit soumettre le formulaire

J'ai un formulaire sur wordpress. Je souhaite que l'utilisateur puisse cliquer sur une image au lieu du bouton de soumission standard. J'ai l'image apparaître et le bouton de soumission disparaître - mais rien ne se produit lorsque je clique sur l'image.

C'est le code que je utilise:

.formBuilderForm .formBuilderSubmit { 
clear: both; 
text-align: right; 
    display:block; 
width:228px; 
height:49px; 
background: url(my image url) no-repeat; 
text-indent:-999em; 

Avant de dire « google » ou essayer la recherche: J'ai essayé les méthodes mentionnées ici: http://www.queness.com/post/798/5-techniques-to-style-buttons-using-images-and-css

J'ai lu similaire messages tels que celui-ci sur stackoverflow mais ils ne résolvent pas mon problème frustrant simple. How to change an input button image using CSS?

Merci pour votre aide.

+2

Veuillez également afficher le code HTML associé. Etes-vous conscient de l'élément ''? –

+0

Merci pour la réponse rapide! Je suis conscient de cela - cependant le bouton de soumission fait partie d'un plugin wordpress et je ne veux pas vraiment le pirater. Dans la documentation de ce plugin développeur, les éléments peuvent être édités en utilisant css sans impact - c'est pourquoi je prends cette approche. – Tom

Répondre

1

mettre cela au lieu d'un bouton d'envoi

<input type="image" src="http://imageurl"> 
+0

merci - mais le bouton de soumission fait partie d'un plugin wordpress et je ne veux pas y faire du piratage. – Tom

+0

n la documentation de ce développeur de plugin dit que les éléments peuvent être édités en utilisant css sans impact - c'est pourquoi je prends cette approche. – Tom

0

Au cas où quelqu'un se soucie: Ce fut un problème avec le FormBuilder Plugin Wordpress. J'ai utilisé des CSS très similaires en utilisant le formulaire de contact 7 et cela a fonctionné.

padding:8px 0 10px 0px; 
color:#FF0000; 
border:none; 
width:107px; 
height:26px; 
text-align:center; 
background-image:url(the url went here); 
background-repeat:no-repeat; 
text-indent:-999em; 

Merci pour l'aide.

Questions connexes