Maxime,
Sans voir le code du formulaire, c'est difficile de présenter un code fini.
Les éléments de formulaires sont, graphiquement parlant, définis par le navigateur. Pour les customiser, il faut les redéfinir.
J'ai refait un exemple qui correspond à celui que tu fournis :
codepen.io/Eddy-vh/pen/ExpZELz
Il suffirait de coller le code CSS dans la pièce de formulaire ou il est inutile de répéter les echo… 1 seul suffit. Il reste à adapter les couleurs.
Remplacer le tout par :
echo '
<style>
span label {
font-size: 1.2em;
}
span.bfElementGroupNoWrap input[type=checkbox] {
appearance: none;
width: 18px;
height: 24px;
border: 1px solid;
vertical-align: bottom;
}
span.bfElementGroupNoWrap input[type=checkbox]:checked:after {
display: block;
content: "X";
font-size: 1.4em;
text-align: center;
}
span.bfElementGroupNoWrap input[type=checkbox]:nth-of-type(1):checked {
border-color: #19b100;
}
span.bfElementGroupNoWrap input[type=checkbox]:nth-of-type(1):checked:after {
background-color: #19b100;
}
span.bfElementGroupNoWrap input[type=checkbox]:nth-of-type(2):checked {
border-color: #feae02;
}
span.bfElementGroupNoWrap input[type=checkbox]:nth-of-type(2):checked:after {
background-color: #feae02;
}
span.bfElementGroupNoWrap input[type=checkbox]:nth-of-type(3):checked {
border-color: #ed220c;
}
span.bfElementGroupNoWrap input[type=checkbox]:nth-of-type(3):checked:after {
background-color: #ed220c;
}
input[type=radio] { // à voir comment doivent apparaître les radios…
transform: scale(1.2);
background-color: #eee;
}
</style>
';
Bonne nuit.
Topic Author 
