[Résolu] Ciblage d'une div grâce à :target

Bonjour, je m'inspire du tuto suivant : http://www.alsacreations.com/tuto/lire/1234-creer-volet-coulissant-CSS3-target-transition.html pour créer un menu descendant, pour mobile.

En lisant ce tuto, j'ai vu qu'on pouvait cibler une div autre que la div sur laquelle dirige le lien :

#volet_clos:target #volet {
    left: -270px;
}

Cela ne semble fonctionner que dans une certaine configuration.

Voici mon code HTML, je désire agir sur la div "content" en cliquant sur le lien #liste_ouverte mais cela ne fonctionne pas.

<div id="wrapper">

			<div id="logo">
			</div>

			<div id="reference">

				<div id="liste_cachee">

					<div id="liste_ouverte">
						<ul>
							<li><a href="" alt="">Lien 1</a></li>
							<li><a href="" alt="">Lien 1</a></li>
							<li class="menu-mobile"><a href="#liste_ouverte" alt="">MENU &darr;</a></li>
							<li class="menu-mobile2"><a href="#liste_cachee" alt="">MENU &uarr;</a></li>
						</ul>
					</div>
			
				</div>

			</div>	

		</div>

		<div id="content"></div>

Et mon CSS :

/* état de départ *************************************** */
#logo {
	z-index: 10; /* passe "au-dessus" #liste_ouverte */
}
#reference {
	position: relative;/* référence position #liste_ouverte */
}
#liste_ouverte {
	position: absolute;
	top: -55px;
	z-index: -1;/* passe "dessous" #logo */
}
#content  {
	position: relative;/* positionné par rapport à #reference */
	top: 20px;
}
li.menu-mobile {
	display: block;
}
/* état d'arrivée **************************/
#liste_ouverte:target {
	top: 0px;
	z-index: 10;
}
#liste_ouverte:target #content {
	top: 150px;/* marche pas  [decu]*/
}

Après plusieurs tests, il semble que :target n'agira sur une "cible2" autre que celle sur laquelle dirige le lien (cible1), que si "cible2" est un enfant de "cible1".

Ceci étant, je suis naturellement preneur de commentaires car mon appréciation peut être erronée (la plupart du temps, elle l'est !)

salut,
la réponse la plus correcte serait que tout simplement, en CSS, tu ne peux agir que sur un élément adjacent ou enfant de l'élément relatif.
En gros, dans ton code, l'élément que tu cibles est frère de "l'arrière grand parent" (oui ^^) de "#liste_ouverte". Donc un problème de générations se pose !

Bonjour, merci pour ta remarque, j'aime bien ta définition.

C'est vrai que CSS veut dire "cascading" et je l'avais oublié.

J'avais lu ça et là que "n'importe quel ancre pouvait être ciblée". D'où mon message.

Cordialement.