Archief - CSS: display block <-> IE

<ul class="navlist">
	  <li><a href="index.htm">Home</a></li>
	  <li><a href="onderdelen.htm">Onderdelen</a></li>
	  <li><a href="systemen.htm">Systemen</a></li>
	  <li><a href="software.htm">Software</a></li>
	  <li><a href="randapparaten.htm">Randapparaten</a></li>
	  <li><a href="contact.htm">Contact</a></li>
</ul>

.navlist
{
  padding: 1px 1px;					/* Dikte van de rand rond de links */
  margin-left: 0;						/* Tekst plakt tegen de linkerkant */
  font: bold 12px Arial, sans-serif;		/* Lettertype en grootte van de tekst in de menu */
  background: #000000;					/* Kleur van de kader rond het geheel */
  width: 120px;						/* Breedte van de menu */
}

.navlist li
{
  list-style: none;					/* Geen bolletjes voor de lijstitems etc */
  border-top: 1px solid #000000;			/* Kleur van de lijn bovenaan de cel */				
  text-align: left;					/* Tekst wordt links uitgelijnd */
}

.navlist li a
{
  display: block;						/* Wordt als blok weergegeven, met een linebreak voor en na het element */					
  padding: 3px 3px 3px 5px;				/* Ruimte rond de tekst */
  border-left: 7px solid #FFFFFF; 			/* Breedte van het streepje voor de link */
  background: #0057A1;					/* Achtergrond van de links */
  text-decoration: none;				/* Niet onderlijnen */
}

.navlist li a:link { 
  color: #FFFFFF; 
}

.navlist li a:visited { 
  color: #FFFFFF; 
}

.navlist li a:hover {
  border-color: #FF9C00;
  color: #FF9C00;
}