breakthrough design

Oftentimes, you find yourself creating dynamic CSS driven menus, embedded within lists. (See every site in our portfolio). The key to this is usually the following structure (simplified):


<ul>
<li><a href="somepage.html">Home</a><li>
<>ul>


The Problem
The problem is found when setting your <a> link as

display:block

, you’ll see that although it visually renders properly within IE, and mozilla firefox, opera, etc - you will notice that IE doesn’t allow you to click anywhere within the link? What? You say?

The solution
The solution is to set a position:relative on the <a>. Like so:


<style>
a {display:block; position:relative}
</style>
&html>

Enjoy!