滑动门CSS菜单的问题...

Question

所以我试图做一个推拉门CSS菜单 - 基本上是一个图像，当你移动它的背景位置时，或者它是活动的。

然而，通常当我移动到使用下一个环节：

#xmenu li.ypart {width:80px; height:35px;} 
#xmenu li.ypart a {background-position:-33px 0px; } 

它从最后一个环节到我指定的任何宽度。请参阅下图中的地图图标？我正在尝试将其链接，以便链接不会从“发送反馈”链接一直到地图按钮。我只是想让链接成为那个方块。

那么有什么想法？

Answer 1

如果我理解正确，您应该使链接（<a>元素）为一个块元素，并为其指定一个特定的宽度和高度（也可能是相对/绝对定位，具体取决于您的布局设置）。这样，链接的命中区域将局限于这些维度。

像这样的标记：

... 
<a href="/map">Map</a> 
... 

而且像这样的CSS：

#xmenu li.ypart a { display: block; width: 40px; height: 35px; }