28111 sujets

CSS et mise en forme, CSS3

Sélecteur d'une class dans une div ?

Bonjour
Comme je vous l'ai signalé dans mon précédent sujet, je ne maîtrise pas parfaitement le langage HTML/CSS, je vous prie donc de m'excuser si mes questions vous paraissent naives, merci d'avance.
Voilà, je voudrais sélectionner des éléments identifiés avec des class pour les supprimer de cette page
upload/1674468446-85392-capturedaeacran2023-01-23aa11.jpg
Ces élément sont, la bannière identifiée par 
<dic class="jumbotron mb-0">
comprise dans 
<Body id="theContactPage"...>

J'ai modifié le CSS par 
#theContactPage.jumbotron.mb-0{display:none ! important;}

Ainsi que le deuxième menu en dessous de la bannière sur la photo identifié par 
<nav class="navbar navbar-expand-lg navbar-contextual navbar-dark bg-primary sticky-top mb-2">
que j'ai modifié dans le CSS par 
  #theContactPage.navbar.navbar-expand-lg.navbar-contextual.navbar-dark.bg-primary.sticky-top.mb-2 {display:none;}

Mais Smiley ohwell ça ne fonctionne pas Smiley bawling
Pouvez-vous me donner des pistes pour y arriver svp ?
Merci d'avance
Modifié par Ducale84 (23 Jan 2023 - 11:17)
Modérateur
Salut,

Pour les sélecteur CSS si tu les colles c'est que c'est le même élément. Donc si tu veux cibler un "element fils" il faut un espace. Exemple :

<div class="a b">
    <div class="c d">Test</div>
</div>

.a.b .c.d {
    /* CSS */
}


Docn dans ton premier cas il faut mettre un espace entre #theContactPage et .jumbotron car ce n'est pas le même élément. Il ne faut pas mettre d'espace entre .jumbotron et .mb-0 ca c'est le même élément. Par contre je pense que tu peux te passer de .mb-0, l'élément est déjà ciblé par .jumbotron il n'y a peut être pas vraiment d'intérêt à la cibler plus (il peut y en avoir).

#theContactPage .jumbotron.mb-0 {
    display:none ! important;
}


Je te laisse appliquer au second sélecteur.

Bonne journée
Il aurait été préférable de mettre le code dans un bloc code/HTML que de donner une image difficile à lire
Pour autant que j’arrive à lire le HTML il n’y a qu’un seul élément dans la page qui possède la classe jumbotron
Il suffit d’écrire
.jumbotron {display:none}

De même pour le deuxième il n’y a qu’une seule balise qui ait la classe navbar-contextual.
On n’a pas besoin de faire plus, on n’est pas obligé de donner tout l’héritage ni toutes les classes d’une balise, dès l’instant où il n’y en a pas d’autres qui ont la même classe
Modérateur
PapyJP a écrit :
Il aurait été préférable de mettre le code dans un bloc code/HTML que de donner une image difficile à lire
Pour autant que j’arrive à lire le HTML il n’y a qu’un seul élément dans la page qui possède la classe jumbotron
Il suffit d’écrire
.jumbotron {display:none}

De même pour le deuxième il n’y a qu’une seule balise qui ait la classe navbar-contextual.
On n’a pas besoin de faire plus, on n’est pas obligé de donner tout l’héritage ni toutes les classes d’une balise, dès l’instant où il n’y en a pas d’autres qui ont la même classe

+1000 pour PapyJP, j'avoue ne pas avoir ouvert la page ét etre allé jusque là Smiley ravi
Moyennant quoi tu as bien fait de lui expliquer la syntaxe des combinaisons de classes dans un sélecteur Smiley smile
Prévenir un modérateur
Répondre au sujet
Aller à