[Résolu] Elements de liste invisible ?

Bonjour tout le monde.
Voila j'ai une petite question sur le statut visible / invisible d'élements de liste.
J'ai actuellement une liste imbriquée de ce type :

<h1>Navigation</h1>
<ul>
	<li><a href="">Investisseurs<span class="none">(selectionné)</span></a></li>
	<li><a href="">Journalistes</a></li>
	<li><a href="">Candidats</a></li>
	<li class="san">Notre groupe
		<ul>
			<li class="tot">En bref</li>
			<li><a href="">Recherche & innovation</a></li>
			<li><a href="">Produits & présence</a></li>
		</ul>
	</li>
</ul>

Et voici la CSS

ul li.san {color:#F00;display:none;}
ul li ul li.tot {color:#FF0;display:inline;}

Mon problème est le suivant. En activant les CSS je voudrait rendre l'item Notre groupe Invisible et les éléments de liste suivants (En bref, Recherche et innovation, Produit/Pres) visibles. Or en mettant la propriété display none au "père" je n'arrive pas a rendre les "fils" visible.

Quelqu'un a une idée ?

Ah oui pour info je ne peut pas faire 2 listes disctinces ! ;(

Merci pour vos conseils
Modifié par moon (06 May 2008 - 16:41)

Les fils sont visibles, à l'intérieur d'un père qui ne l'est pas. Ce que tu cherches à faire n'est pas possible. Si un élément est invisible, tout ce qu'il contient le sera forcément....

skywalk3r a écrit :
Les fils sont visibles, à l'intérieur d'un père qui ne l'est pas. Ce que tu cherches à faire n'est pas possible. Si un élément est invisible, tout ce qu'il contient le sera forcément....

Arg c'est un peu ce que je pensait... Voyez vous une solution a ca ? Hormis faire 2 listes ?

Salut,
Je ne sais pas si j'ai bien compris ton raisonnement mais pourquoi n'utiliserais-tu pas cela :

ul li.san { visibility: hidden;}
ul li ul li { visibility: visible;}

Quel est réellement le but de cette pratique ?

yodaswii a écrit :
Quel est réellement le but de cette pratique ?

Accessibilité.
Je m'explique.

En fait les éléments qui sont en dessous de "Notre groupe", a savoir en bref, r&i etc sont des éléments affichés "quand les css sont actives" mais pas le mot "Notre groupe". Voila c'est pour ca que je voudrais donner cette information aux personnes handicapées (mais sans l'afficher).

lilycoeur a écrit :
Salut,
Je ne sais pas si j'ai bien compris ton raisonnement mais pourquoi n'utiliserais-tu pas cela :

ul li.san { visibility: hidden;}
ul li ul li { visibility: visible;}

Hello Lilycoeur !
En effet ta méthode fonctionne mais hélas elle laisse un espace entre les éléments que je n'arrive pas a enlever

moon a écrit :


Hello Lilycoeur !
En effet ta méthode fonctionne mais hélas elle laisse un espace entre les éléments que je n'arrive pas a enlever

Pour supprimer l'espacement en trop, tu peux appliquer cela :

ul li.san { margin-top: -12px;}

lilycoeur a écrit :


Pour supprimer l'espacement en trop, tu peux appliquer cela :

ul li.san { margin-top: -12px;}

Hello Lily ! En effet ca a l'air de fonctionner. Merci beaucoup pour l'astuce

a écrit :
Accessibilité.

La pratique de cacher des éléments ne rentrent pas dans cette démarche ... surtout pour les utilisateurs de certains lecteurs d'écran.

yodaswii a écrit :
Accessibilité.

La pratique de cacher des éléments ne rentrent pas dans cette démarche ... surtout pour les utilisateurs de certains lecteurs d'écran.

Ben il s'agit de la meme méthode que ce qu'on utilise pour des h1 cachés par exemple pour des slots ou des grandes zones de la page. Pour que le lecteur braille puisse naviguer rapidement de h1 en h1 non ?