1. Accueil
  2. Question et réponse
  3. Sélecteur enfant CSS (>) ne fonctionne pas avec IE

Sélecteur enfant CSS (>) ne fonctionne pas avec IE

2010-03-08 5 views
5

Le CSS suivant fonctionne bien sous firefox mais ne fonctionne pas sous navigateur IE, pourquoi?
Aussi, comment puis-je faire que seuls les éléments, directement sous l'élément parent, soient affectés par CSS?Sélecteur enfant CSS (>) ne fonctionne pas avec IE

CSS:

.box{font:24px;} 
.box>div{font:18px} 
.box>div>div{font:12px;}

HTML:

<div class="box"> 
    level1 
    <div> 
     level2 
     <div> level3</div> 
     <div> level3</div> 
    </div> 
    <div> 
     level2 
     <div> level3</div> 
     <div> level3</div> 
    </div> 
</div>

Source

2010-03-08 Geln Yang

Répondre

18

Internet Explorer prend en charge le sélecteur d'enfant (>) depuis la version 7, mais seulement en mode standard. Assurez-vous que vous utilisez a Doctype that triggers standards mode.

Si vous ciblez IE6, vous n'avez pas de chance. Vous devez soit dépendre de JS, soit utiliser des sélecteurs descendants.

a>b { foo }

devient

a b { foo } 
a * b { reverse-of-foo }

Source

2010-03-08 16:18:37 Quentin

+1

Désolé de ressusciter, mais je suis à perte avec la partie 'reverse-of-foo': P – Baumr

+0

@Baumr la règle' a b' va déclarer les propriétés destinées au descendant; La règle 'a * b' devrait déclarer que les propriétés l'emportent sur la règle ci-dessus. – Barney

-2

Je peux me tromper sur ce que vous cherchez, mais voici comment j'attaquer votre problème:

.box {font:24px;} 
.box div {font:18px} 
.box div div {font:12px;}

Cela fonctionne bien pour vous par exemple, mais sachez que si vous avez une autre .box avec div dans ce qu'ils seront touchés aussi bien.

Source

2010-03-08 17:05:53

Questions connexes

 Questions connexes