css下拉点击不动,CSS下拉菜单：我如何点击整个li：悬停，而不仅仅是其中的超链接？...

我希望我用正确的话正确地问这个问题：我有一个非常基本的CSS下拉菜单，突出显示(背景颜色)每个李我悬停在他们。当我悬停时，我希望能够点击整个li区域以到达链接目的地，而不必找到位于该li中的超链接来执行点击。CSS下拉菜单：我如何点击整个li：悬停，而不仅仅是其中的超链接？

为了便于讨论，这里是我的菜单的简化：

• CATEGORY
  • Florists
  • Caterers
  • Formal Wear
  • All Categories...

...和CSS：

.catnav ul {list-style:none;margin:0px;padding:0px;}

.catnav li {float:left;text-align:center;position:relative;background:#f5f6f7;padding:0px 10px 0px 10px;}

.catnav li ul li {float:none;width:150px;text-align:left;padding-left:0px 0px 0px 5px;line-height:17px;}

.catnav a {text-decoration:none;color:#548dd4;font-family:arial;}

.catnav li ul {position:absolute;top:21px;left:0px; border:1px solid #ccc;

-moz-box-shadow: 0px 3px 10px #aaa;

-webkit-box-shadow: 0px 3px 10px #aaa;

box-shadow: 0px 3px 10px #aaa;

visibility:hidden;}

.catnav li:hover ul {visibility:visible;z-index:100;}

.catnav li:hover {background:#e0e0e0;}

.catnav li:hover li a {font-size:0.8em;font-weight:normal;visibility:visible;z-index:100;}

任何帮助将是巨大的。谢谢！

Ĵ