Couleur de texte sur bouton et bidouillage de CSS

[Ibrahim]

Salut à tous,

 

Alors voilà, j’avais bidouillé (je n’y connais rien) un bouton en CSS pour l’ajouter sur une page de mon WooCommerce et en me baladant sur mon site aujourd’hui je me rends compte que le bouton “poursuivre les achats” (qui est déjà là par défaut)et en vert sur fond vert…

J’ai essayé de retrouver dans le CSS additionnel si y avait du vert quelque part mais je trouve pas.

Comment je peux faire pour mettre le vert du bouton “poursuivre les achats” en blanc.

 

Code bidouillé, récupéré sur le net :

/*
Vous pouvez ajouter du CSS personnalisé ici.

Cliquez sur l’icône d’aide ci-dessus pour en savoir plus.
*/

.woocommerce-billing-fields input {

text-transform: initial!important;
}

.btn.btn-border-w {
font-weight: bold;
text-decoration: none;
color: rgba(255, 255, 255, 1);
background: rgb(110,113,33,1.0);
padding: 20px 40px;
border-radius: 8px;
font-weight: normal;
transition: all 0.3s ease-in-out;
box-shadow: 0 0px 30px rgba(255, 255, 255, 1);
}

.button {
display: inline-block;
text-align: center;
vertical-align: middle;
padding: 14px 80px;
border: 0px solid #a12727;
border-radius: 23px;
background: #647021;
background: -webkit-gradient(linear, left top, left bottom, from(#647021), to(#788c3c));
background: -moz-linear-gradient(top, #647021, #788c3c);
background: linear-gradient(to bottom, #647021, #788c3c);
text-shadow: #175919 5px 3px 4px;
font: normal normal bold 24px arial;
color: #ffffff;
text-decoration: none;
}
.button:hover,
.button:focus {
background: #788628;
background: -webkit-gradient(linear, left top, left bottom, from(#788628), to(#90a848));
background: -moz-linear-gradient(top, #788628, #90a848);
background: linear-gradient(to bottom, #788628, #90a848);
color: #ffffff;
text-decoration: none;
}
.button:active {
background: #3c4314;
background: -webkit-gradient(linear, left top, left bottom, from(#3c4314), to(#788c3c));
background: -moz-linear-gradient(top, #3c4314, #788c3c);
background: linear-gradient(to bottom, #3c4314, #788c3c);
}
.button:before{
content:  “\0000a0”;
display: inline-block;
height: 24px;
width: 24px;
line-height: 24px;
margin: 0 4px -6px -4px;
position: relative;
top: 0px;
left: 0px;
background: url(“data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAABWUlEQVRIie2SMUoDURRFz5UsQYJVGMIsQKxtZLD/AwbBxrW4BJdgL+SnlsFCa3EBIQypxC2M+CySH74hzp8hlrkwxfzHu/e9+y4ckIDaipPJhKZpboB7YAlce+/nfQSO2opN05wDD8AxcAY8OefG/yYAnEoaSKtFJWVA1UekVcDMHs1sbmZIwswAgki+t8BsNvsACmABICl8GR3tSlmE934JFGa2CG/rjTI62NWaohjOuRFQAXlkF0ANXP6Vrs4CkcizpF9Tm1kNXHjv6+2epEUxEnbd7erpJQCrQ2+Rh9/vvQXKshyZWSVpHN0gWLTfBmVZjoANeYismdWSil3+Q8cjO+cySRUwjm1ZT1547xd/9SYFQnKATXLC5CnypIBz7gR4kZRvHbQGiul02koO6RtcScrD1H3JAQaJ+ruZfUkarFNT08GWGK0bDIfDV+DWzD6Bt77kB3TCD1cuo2reO+LVAAAAAElFTkSuQmCC”) no-repeat left center transparent;
background-size: 100% 100%;
}

 

Merci à tous !

1 utilisateur a remercié l'auteur de ce message.

[Guy]

Salut Ibrahim,

Pour avoir le plaisir et la satisfaction de l’avoir fait toi-même, tu vas sur http://www.code-couleur.com

Dans la case prévue tu colles chaque code couleur de ton css et tu vois le résultat. Tu découvriras facilement ceux à modifier. Et tu pourras choisir celui de remplacement.

Content(e) de mon aide ? Vous pouvez m'offrir un café ! 🙂

Avant d'appeler à l'aide: Dépannage Woocommerce

Vous manquez de trafic ? Payez le prix d'un seul backlink et obtenez-en beaucoup plus !

[Auteur]

Messages