28172 sujets

CSS et mise en forme, CSS3

Bonjour,

Je travaille actuellement avec un thème un peu limité alors j'ai besoin d'aide en css pour le contourner.
J'ai 4 blocs : 2 de 50% sur une ligne et 2 autres sur une 2nde ligne. Les couleurs de background sont alternées : 1è ligne : gris - blanc / 2è ligne : blanc - gris.
Forcément, quand on passe en mobile, les blocs passent les uns en dessous des autres et les 2 blancs se retrouvent l'un sur l'autre.
Je n'ai pas la possibilité de mettre une classe au niveau de chaque bloc pour changer les couleurs en média queries. Existe t-il une astuce css ?
Voici l'URL de la page : https://www.avecdesmots.com/ les 4 blocs sont sous le diaporama principal.

Merci de votre aide et bonne soirée !
Marine
Salut,

Je ne sais pas si ma réponse peut t'aider, mais si tu as :


<div class="div1">Div 1</div>
<div class="div2">Div 2</div>



div.div1 + div.div2{background:blue;}


De cette façon, Div 2 aura un fond bleu.

Cela te permet de cibler des choses qui se suivent, si tes divs ont déjà des noms attribuées, ou des classes.

Tu peux aussi

<div class="div1">
  <div class="maclasse">Contenu</div>
</div>



div.div1 div.maclasse{background:yellow;}


Si les choses sont à l'intérieur d'autres choses.

Il y a aussi l'expression
:first-child
:


<div>
  <p>Ce paragraphe est le first-child de son parent (div) et aura un fond jaune.</p>
  <p>Ce paragraphe est le second child de son parent.</p>
</div>


p:first-child {
    background-color: yellow;
}


Ainsi, le premier "p" aura un fond jaune.

Je ne sais pas si cela peut t'aider, et si tu as la possibilité de déclarer du code à un endroit quelconque. Désolé si cela n'aide pas!