28111 sujets

CSS et mise en forme, CSS3

[Résolu] Selecteur enfant sans classe

Bonjour,

Je souhaite dans une liste non ordonnée "démarrer" le contenu (le premier élément <li>) à la limite du conteneur parent (visuellement, typiquement, un <div> ou autre éléments de type block) sans utiliser de classe et que les sous-éléments (listes imbriquées) soient, eux, bien en retrait. J'ai un code basique :


<ul>
  <li>lorem</li>
  <li>lorem</li>
  <ul>
    <li>dolor</li>
    <li>dolor</li>
    <li>dolor</li>
  </ul>
  <li>lorem</li>
  <li>lorem</li>


J'utilise donc le secteur enfant pour supprimer le premier retrait sur l'ensemble des enfants du premier <ul> mais ça ne fonctionne pas (logique puisque la même règle peux s'appliquer aux descendants, sans classe Smiley murf ) mais je me retrouve dans une impasse.


ul>li {
  padding-left: 0;
}


Comment je peux m'y prendre ?

(Sachant aussi que je peux avoir plusieurs tableaux sur une seule page !)
Modifié par bengo (20 Feb 2019 - 15:41)
Modérateur
bonjour, ton code basique est faux (pour commencer), un ul ne peut contenir que des li:


<ul>
  <li>lorem</li>
  <li>lorem</li>
  <li>
    <ul>
      <li>dolor</li>
      <li>dolor</li>
      <li>dolor</li>
    </ul>
  </li>
  <li>lorem</li>
  <li>lorem</li>
</ul>


Sinon quelque chose du genre:

ul {
  padding: 0;
}
ul ul {
  padding-left: 1em;
}


Enlever les marges sur tous les éléments, et les rajouter sur tous sauf le premier
Modifié par kustolovic (20 Feb 2019 - 15:43)
Meilleure solution
Le code basique en prod est bon lui, et le code CSS fonctionne comme voulu.

Merci pour ton aide !
Sujet clos
Aller à