De standaard opsomming in Joomla ziet er niet erg aantrekkelijk uit.

  • De rechtermarge op de :before kun je invullen zoals je wilt.
  • De (negatieve) linkermarge is bulletbreedte+rechtermarge.
  • De ul-padding-left moet gelijk zijn aan de :before-linkermarge.

Daarom gebruik ik vrijwel altijd onderstaande css.

/* BALLETJES BIJ OPSOMMING */
.colorbull {list-style: none;}
.colorbull li {margin-top: 0.25em;}
.colorbull ul {padding-left: 1.5em;}
.colorbull li::before {
content: "";
display: inline-block;
width: .5em;
height: .5em;
border-radius: 50%;
background: #715A3C;
margin: 0 1em 0 -1.5em;
}

En dan ziet 't er zo uit:

  • De rechtermarge op de :before kun je invullen zoals je wilt.
  • De (negatieve) linkermarge is bulletbreedte+rechtermarge.
  • De ul-padding-left moet gelijk zijn aan de :before-linkermarge.