[Résolu] Sélectionner un liste dans une liste

Bonjour,
J'aimerais sélectionner une <li> qui est déjà dans une <li> mais je sais pas comment faire avec CSS.

Code HTML :

				<ul>			
				<li><strong>It's 100% Natural</strong></li>
					<li>Acne Getaway 101E is a skin-friendly, soft and tender lotion which contains all natural.</li>
				<li><strong>It's 100% Safe</strong></li>
					<li>Acne Getaway 101E is a skin-friendly, soft and tender lotion which contains all natural solution.</li>
				<li><strong>It's Highly Effective</strong></li>
					<li>Acne Getaway 101E is a skin-friendly, soft and tender lotion which contains all natural.</li>
				<li><strong> It's Clinically Tested</strong></li>
					<li>Acne Getaway 101E is a skin-friendly, soft and tender lotion which contains all natural.</li>
				<li><strong>More than 90,000 successful users</strong></li>
					<li>Acne Getaway 101E is a skin-friendly, soft and tender lotion which contains all natural.</li>
				</ul>

Code CSS :

.col1_b2 li {
list-style-type:none;
background-image: url(../design/fleche-c1b2.gif);
background-repeat: no-repeat;
background-position: 0px 4px;
padding-left: 17px;
font-family: arial, verdanna, sans-serif;
font-size: 0.8em;
}

.col1_b2 li li { /* style qui doit être appliquer aux "sous" <li> */
font-family: arial, verdanna, sans-serif;
font-size: 0.7em;
padding-left: 0px;
padding-bottom: 13px;
margin: 0px;
}

Dans ce code j'aimerais sélectionner, avec CSS, tous les "sous" <li> (ceux qui commencent avec "Acne").

Merci.
Modifié par darktemplar (31 Mar 2010 - 21:02)

Bonjour,

J'ai un peu de mal à comprendre ton "<li> qui est dans un <li>" vu que tous les <li> sont au même niveau (la mise en forme du code ne joue pas dans les niveaux).

Pour ne cibler que certains élément <li>, le plus simple est de leur attribuer une classe.

Mais, étant donné que que les <li> que tu affiche en décalé ne sont pas tellement des <li> à part entière dans la liste complète, mais une portion du <li> les précédant, je retoucherais ton code comme suit :

<ul>
  <li><strong>It's 100% Natural</strong><span>Acne Getaway 101E is a skin-friendly, soft and tender lotion which contains all natural.</span></li>
  <li><strong>It's 100% Safe</strong></li><span>Acne Getaway 101E is a skin-friendly, soft and tender lotion which contains all natural solution.</span></li>
  <li><strong>It's Highly Effective</strong></li><span>Acne Getaway 101E is a skin-friendly, soft and tender lotion which contains all natural.</span></li>
  <li><strong> It's Clinically Tested</strong></li>                    <span>Acne Getaway 101E is a skin-friendly, soft and tender lotion which contains all natural.</span></li>
  <li><strong>More than 90,000 successful users</strong></li><span>Acne Getaway 101E is a skin-friendly, soft and tender lotion which contains all natural.</span></li>
</ul>

Tu pourras ensuite styler les span avec "ul li span".

Merci, ton code a quelques erreurs (</li> fermantes de trop après les spans) mais après correction il marche très bien.

Oui effectivement, c'est une erreur de recopie (la première ligne est bonne), merci de ne pas être trop sévère sur du code tapé directement dans le formulaire de réponse ^^;