Changer la couleur de "bloc coloré pleine largeur"

[cbo]

Bonjour à toute l'équipe, concepteurs et forumeurs!

Je connais vraiment peu de chose du CSS, et voilà ce que j'ai écrit (après sauvegarde  ) dans l'éditeur CSS, pour modifier la couleur (bleue de base) du "bloc coloré pleine largeur" :

/* fullwidthcolorbox */
/*
.blockFullWidth colorbox-0 {
    background-color: rgba(207,218,122,1);
}

*/

Je n'ai pas obtenu de changement de couleur.

Quelle est la procédure à suivre?

Autre question :

Comme je souhaite utiliser plusieurs blocs à suivre sur la même page, j'aimerai bien leur donner des couleurs différentes.
Dois-je changer quelque chose dans le code HTML aussi? Comme par exemple renommer colorbox-0 en colorbox1, pour pouvoir ensuite modifier la couleur dans l'éditeur CSS?

Merci de votre retour d'info,

Claire

[Lionel]

Je n'ai pas obtenu de changement de couleur.

Quelle est la procédure à suivre?

C'est la class CSS .colorbox-0 qu'il faut modifier, et tu as omis le point qui identifie cette class, ses valeurs par défaut sont :

Code Sélectionner Étendre

.colorbox-0 {
color: #F7F6CF;
background-color: #5784BA;
display: block;
}
.colorbox-0 a {
color: #FFBF66;
}
.colorbox-0 h2, .colorbox-0 h3{
color: #F4CFDF;
}

je souhaite utiliser plusieurs blocs à suivre sur la même page, j'aimerai bien leur donner des couleurs différentes

Les pseudo-classes :nth-child() permettent de le faire, mais sont un peu délicates à manipuler pour quelqu'un qui connait vraiment peu de chose du CSS
Sinon, oui, renommer colorbox-0 en colorbox1 revient à créer une nouvelle class CSS, que tu n'es pas obligée de nommer colorbox

[Lionel]

Exemple :

Code Sélectionner Étendre

.colorbox-0 {
    background-color: rgba(207,218,122,1);
}

.truc {
    background-color: red;
}

.chose {
    background-color: green;
}
Ajout des class CSS en mode code source :

You cannot view this attachment.

Résultat :
You cannot view this attachment.

[cbo]

Bonsoir Lionel,

Merci de ta réponse, j'ai recopié le code dans l'éditeur CSS (en modifiant qq couleurs)et toujours aucun changement :

*/

/* fullwidthcolorbox */
/*
.colorbox-0 {
    color: #040400;
    background-color: #cfda7a;
    display: block;
}
.colorbox-0 a {
    color: #584f40;
}
.colorbox-0 h2, .colorbox-0 h3{
    color: #F4CFDF;
}

*/

Qu'est-ce que j'oublie?