27573 sujets

CSS et mise en forme, CSS3

Salut tout le monde, ça faisait une E-TER-NI-TÉ que je n'étais pas revenu ici.
On y fait toujours le plein de Kiwis ?

Je bosse sur un CMS qui ne me laisse PAS la main sur le formulaire, html/php.
Cependant, je peux atteindre et modifier les CSS. Ce qui me va déjà très très bien Smiley cligne
Je souhaite rendre la première OPTION "c0" selected d'un SELECT comme étant indésirable EN ROUGE à l'ouverture du navigateur car sa valeur est nulle"- " si on choisit une autre option, celle-ci devrait apparaître en vert.
Donc comme je ne peux pas agir sur le formulaire il faut créer cette alerte visuelle.

<style>select{color: white; background-color: blue}
option:default, [value="c0"], [selected], option:first-child, option:focus{background: red; color:white;}
</style>		
<select name="test" id="test1">
	<option selected  value="c0">-</option>
	<option  value="dog">dog</option>
	<option value="cat">cat</option>
	<option value="lapin">lapin</option>
</select>


Un pt'it coup de main ?
Merci à vous !!!
Administrateur
Bonjour,

Il doit être possible de faire des trucs avec Firefox mais PAS Chrome. Instylable. Smiley confused
Il te faudra donc ah non t'as pas la main. Mmh ajouter une étiquette au champ, ça aidera à comprendre que la 1ère option n'est pas euh souhaitable, qu'il faut choisir autre chose.
Modérateur
Bonjour,

peut-être as tu accès à JavaScript ? , si oui , tu peut voir à ajouter l'attribut disabled à la volée pour que cette option ne soit plus sélectionnable .
(function () {
  window.onload= document.querySelector('[value="c0"]').setAttribute('disabled','disabled');  
})();


exemple, si j'ai compris la question et dans la limite des possibilité de styles : https://codepen.io/gc-nomade/pen/xxqGNyq

Cdt