Notation raccourcie qui ne fonctionne pas : pourquoi ?

Bonjour,
Je me pose la question de savoir pourquoi cette déclaration ne fonctionne pas (sert à cacher le contenu de mon footer dans une css print) :

#footer ul li a p{
	display: none;
}

en fait je suis obligé de faire cela pour que mon footer soit caché :

#footer ul {
	display: none;
}
#footer li {
	display: none;
}
#footer  a {
	display: none;
}
#footer  p{
	display: none;
}

Merci pour vos conseils

Cent balles que ton code HTML est invalide.

<div id="footer">
      <ul>
            <li><a href="#">P1</a></li>
            <li><a href="#">P1</a></li>
            <li><a href="#">P1</a></li>
            <li><a href="#">P1</a></li>
      </ul>
      <p> &copy; 2008 <a href="" onclick="window.open(this.href); return false;" title="">Pouet</a></p>
<p id="footerPrint">Tralala</p>      
</div>

J'ai bon
Modifié par pan (26 Oct 2008 - 19:09)

Bonsoir pan,

Dans ta déclaration css :

#footer ul li a p{
display: none;
}

Tu cibles un paragraphe (p) qui serait contenu dans un lien (a) lui même contenu dans un item de liste (li) encadré par une liste non ordonnée (ul)...
Ce qui comme, tu le sais certainement, n'est pas conforme :

a écrit :
Une balise du groupe en ligne ne peut contenir QUE une (ou plusieurs autres) balise en ligne.

a est de type inline
p est de type block
Une erreur d'inattention certainement

Ce qui a sans aucun doute fait dire à Florent que ton code html était invalide

Si le but de la manoeuvre était de cacher tes paragraphes contenu dans ton pied de page :

#footer p {
display:none;
}

Convient parfaitement.

L'idée semble néanmoins de masquer le pied de page, pourquoi ne pas faire tout simplement :

#footer {
display:none;
}

Cdt,
Sylvain

Florent V. a écrit :
Cent balles que ton code HTML est invalide.

Au fait vous, fais péter la thunes

6l20 a écrit :

Au fait vous, fais péter la thunes

Personne a dit «pari tenu», que je sache. Et maintenant c'est trop tard. Tant pis pour pan.

(Et puis bon, un code CSS valide mais faux qui vise un code HTML invalide alors que le code HTML réel est valide... euh là je suis pas tout à fait sûr de perdre le pari, dans l'esprit du moins. )
Modifié par Florent V. (26 Oct 2008 - 21:35)

Salut,

Florent V. a écrit :

Personne a dit «pari tenu», que je sache. Et maintenant c'est trop tard. Tant pis pour pan.

(Et puis bon, un code CSS valide mais faux qui vise un code HTML invalide alors que le code HTML réel est valide... euh là je suis pas tout à fait sûr de perdre le pari, dans l'esprit du moins. )

Mauvais perdant

Sinon @pan, je crois qu'il y a simplement une erreur ou une incompréhension dans le sélecteur CSS: pour sélectionner les enfants de #footer, il faut utiliser la notation raccourcie

#footer p, #footer ul, #footer li, #footer a {
   ...
}

qui est la notation raccourcie équivalente au code que tu indiques dans ton second post.
Modifié par Thomas D. (26 Oct 2008 - 22:12)

Thomas D. a écrit :
Salut,
Mauvais perdant

Sinon @pan, je crois qu'il y a simplement une erreur ou une incompréhension dans le sélecteur CSS: pour sélectionner les enfants de #footer, il faut utiliser la notation raccourcie

#footer p, #footer ul, #footer li, #footer a {
   ...
}

qui est la notation raccourcie équivalente au code que tu indiques dans ton second post.

Ah oui exact, voilà, c'est là que j'ai me.dé...

@Florent: C'est pas faux, well done

Euh, moi je veux bien les raccourcis toussa...mais puisqu'il s'agit de masquer tout ce que contient le pied de page:

#footer {
display:none;
}

N'est pas le raccourci ?

6l20 a écrit :
Euh, moi je veux bien les raccourcis toussa...mais puisqu'il s'agit de masquer tout ce que contient le pied de page:

#footer {
display:none;
}

N'est pas le raccourci ?

Non, ce serait plutôt:

#footer > * {display: none;}

ou, pour une version moins précise mais compatible IE6:

#footer * {display: none;}

Florent V. a écrit :

Non, ce serait plutôt:

#footer > * {display: none;}

ou, pour une version moins précise mais compatible IE6:

#footer * {display: none;}