Remplacer un bouton submit par un bouton css [Résolu/Fermé]

Signaler
Messages postés
26
Date d'inscription
mercredi 12 février 2014
Statut
Membre
Dernière intervention
11 mars 2014
-
Messages postés
26
Date d'inscription
mercredi 12 février 2014
Statut
Membre
Dernière intervention
11 mars 2014
-
Bonjour à vous tous,

je viens vers vous pour trouver un peu d'aide à fin de remplacer un bouton input html d'un formulaire.
J'ai crée un bouton en css à deux position avec un hover
voici mon code css

button.css3button {
color:#ffffff;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
border: 2px solid #ffffff;
background:#000000;
}
button.css3button:hover {
color:#000000;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
border: 2px solid #000000;
background:#ffffff;
}
ce que je voudrais hélas sans succès c'est l'utiliser comme input type="submit"
<input type="submit" class="css3button" style="width: 160px;" value="envoyer">

Merci par avance

3 réponses

Messages postés
192
Date d'inscription
lundi 13 juin 2011
Statut
Membre
Dernière intervention
10 septembre 2016
3
Hello,

Là ce que tu fais avec ton CSS c'est de styliser l'élément
button.css3Button
, donc
<button class="css3Button">


Mais ça ne correspond pas à ton
<input type="submit" class="css3Button"/>
.

Ce qu'il faut c'est :
- changer ton html :
<button type="submit" class="css3Button"/>

- changer ton css :
input[type="submit"].css3Button{ .... }
3
Merci

Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire

CCM 92317 internautes nous ont dit merci ce mois-ci

Messages postés
192
Date d'inscription
lundi 13 juin 2011
Statut
Membre
Dernière intervention
10 septembre 2016
3
Je sais pas si avec ton message tu as pu comprendre l'erreur que tu avais fait : tu appliquais un style à un button qui a la class css3Button mais il n'existe pas dans ton html.

A+ Seezer
Messages postés
26
Date d'inscription
mercredi 12 février 2014
Statut
Membre
Dernière intervention
11 mars 2014
1
J'ai trouvé, j'ai crée une class submit et submit hover,

<input type="submit" class="submit" style="width: 160px;" value="Envoyer le formulaire">

Merci pour ta réponse seezer que je viens de découvrir en même temps.
Par contre malgré un border: none; dans une class

a:link 
{
text-decoration:none;
border: none;
cursor: pointer;
}
a:hover
{
color:black;
border: none;
cursor: pointer;
}

sous safari, Google chrome et Firefox j'ai un petit cadre bleu au click autour des mes boutons css mais pas sous ie !!!
une piste ?
Messages postés
26
Date d'inscription
mercredi 12 février 2014
Statut
Membre
Dernière intervention
11 mars 2014
1
J'ai trouvé il fallait ajouter dans la class
outline-style:none;
bonne soirée