<style type="text/css">
.linkcontainer{border-right: solid 0.2px white;margin-right:1px}
.hardlink{color: #FFF !important; border: 1px solid transparent; }
.hardlink:hover{
background:url("/_layouts/images/bgximg.png") repeat-x -0px -489px;
display:inline-block;
background-color:#21374C;
border:0.2px solid #5badff;
line-height:20px;
text-decoration:none !important;}
</style>
<div style="padding-bottom:3px;background:transparent; color:white!important; float:left; margin-right:20px; line-height:42px;">
<span class="linkcontainer">
<a class="hardlink" style="padding:0 10px;" href="http://hronline">HROnline</a>
</span>
<span class="linkcontainer">
<a class="hardlink" style="padding:0 10px; " href="http://hronline/ec">Employee Center</a>
</span>
<span class="linkcontainer">
<a class="hardlink" style="padding:0 10px; " href="http://hronline/businesscommunities">Business Communities</a>
</span>
<span class="linkcontainer">
<a class="hardlink" style="padding:0 10px;" href="http://hronline/internalservices">Internal Services</a>
</span>
<span class="linkcontainer">
<a class="hardlink" style="padding:0 10px;" href="http://hronline/policiesprocedures">Policies&procedures</a>
</span>
<span class="linkcontainer">
<a class="hardlink" style="padding:0 10px;" href="http://hronline/qualitybestpractices">Best Practices</a>
</span>
</div>
我为包含菜单链接的跨度添加了一个右边框。当我将鼠标悬停在每个菜单链接上时,它也有一些背景。这对整个容器造成了不稳定的影响。是什么导致了悬停时的不稳定影响?我好像没搞清楚——再说一遍。。