28171 sujets

CSS et mise en forme, CSS3

Bonjour,

J'ai un style pour mon corps :
body {
background-color: #222;
opacity: 0.8;
background-image:  linear-gradient(#222 1px, transparent 1px), linear-gradient(to right, #222 1px, #888 1px);
background-size: 24px 24px;
...

Puis un style pour un div :
.content {
background-color:#bbb;
...


Normalement, rien de compliqué... mais mon div semble "transparent" et je voie le quadrille alors que le fond devrait être une simple couleur (#bbb).

Je mets une copie d'écran pour que cela soit plus parlant.
upload/1731782105-86647-screenshot5.png
La partie "gris sombre" c'est le corps de la page.
La partie "gris clair" c'est mon div dont le fond devrait être uniforme.

Voyez-vous une explication ?
Merci
Bonsoir, tu as une propriété opacity sur le body. Ce que contient le body sera impacter par cette propriété. Voir https://developer.mozilla.org/fr/docs/Web/CSS/opacity
MDN a écrit :
La valeur s'applique à l'ensemble de l'élément et à ce qu'il contient même si la valeur n'est pas héritée par les éléments fils.

Modifié par casper2 (16 Nov 2024 - 20:10)
Meilleure solution