Copie : Comment ajouter des marges aux éléments

Question

J'ai une liste non ordonnée et je définis le style sur aucun, ce qui crée l'espace indenté par défaut.

Ma compréhension des marges et du remplissage est que la marge est l'espace extérieur d'un élément, j'ai donc essayé d'utiliser margin: 0 pour combler l'écart, mais cela n'a pas fonctionné. Lorsque j'utilise padding: 0, cela supprime l'espace en retrait des éléments li.

Maintenant, je ne comprends pas pourquoi il y a un remplissage et non une marge dans ce cas.

ul {
  type de style de liste : aucun ;
  remplissage : 0px ;
}</pré>
<pre class="brush:html;toolbar:false;"><ul>
  <li>
    Linkedin
  ≪/li>
</ul>

Answer 1

La valeur par défaut du navigateur consiste à ajouter un peu de remplissage à l'interface utilisateur au lieu d'une marge. Donc, utiliser padding: 0px remplacera la valeur par défaut du navigateur.

Regardez l'onglet Calculé à droite, il affiche une liste de styles de navigateur padding-left : 40px ;

ul.no-padding {
  list-style-type: none;
  padding: 0px;
}

ul.no-margin {
  list-style-type: none;
  margin: 0px;
}

<ul>
  <li>
    Linkedin
  </li>
</ul>

<ul class="no-margin">
  <li>
    Linkedin
  </li>
</ul>

<ul class="no-padding">
  <li>
    Linkedin
  </li>
</ul>