Horizontal navigation (HTML list + CSS)

  • IE6 compatible
  • space character in li:first-child:before prevents a Safari display problem
<ul id="nav1">
	<li>
		<a href="/encounters_dev/en/home.html" class="">Home</a>
	</li>
 
	<li>
		<a href="/encounters_dev/fr/about_us/index.html" class="lang">Francais</a>
	</li>
 
	<li>
		<a href="/encounters_dev/fr/about_us/index.html" class="lang">Francais</a>
	</li>
</ul>
#nav1, #header #nav1 a {
	text-decoration: none;
}
 
#nav1 li {
	display: inline;
}
 
#nav1 li:before {
	content: " | ";
}
 
#nav1 li:first-child:before {
	content: " ";
}	
 
#nav1 li a {
	margin-right: 5px;
	margin-left: 5px;
}

Feedback