Can't get rid of list bullets

I wrote the following in HTML and CSS. Despite that, bullets are still visible on the page. What am I doing wrong?

      <div id="sponsors">
          <h3>&nbsp;&nbsp;Sponsors</h3> <!-- Geen mooie oplossing voor 
          het uit uitlijnen van titel en afbeeldingen! -->
          <ul>
            <li>
              <img src="Afbeeldingen/directvpslogo_0.png" max width="100px">
            </li>
            <li>
              <img src="Afbeeldingen/transip-logo.svg" max width="100px">
            </li>
            <li>
              <img src="Afbeeldingen/E-boekhouden.jpg" max width="100px">
            </li>
          </ul>
      </div>

CSS

#sponsors {
  list-style-type: none; /* Verwijdert opsommingstekens */
  padding: 1em 0; /* Afstand van de tekst vanaf de bovenkant */
  position: fixed; /* Houdt dit blok op een vaste plaats */
  right: 0; /* Houdt het blok helemaal rechts */
  top: 0; /* Houdt de bovenkant op deze vaste plaats vanaf boven */
  width: 8em; /* Breedte van het blok */  
}

you need to apply the list style type to the UL, not the div. That’s a property which doesn’t get inherited since it only applies to the list styles, so it’s ignored on the div.

#sponsors {
  list-style-type: none; /* Verwijdert opsommingstekens */
  padding: 1em 0; /* Afstand van de tekst vanaf de bovenkant */
  position: fixed; /* Houdt dit blok op een vaste plaats */
  right: 0; /* Houdt het blok helemaal rechts */
  top: 0; /* Houdt de bovenkant op deze vaste plaats vanaf boven */
  width: 8em; /* Breedte van het blok */  
}

#sponsors ul { list-style-type: none;}

Perfect! :slight_smile: Hoe simpel kan het zijn, wanneer je het snapt. :smile: Bedankt!

1 Like