如何在悬停时阻止div移动

时间:2011-03-05 16:44:40

标签: css html css-float

我想要一个菜单​​,当你将鼠标悬停在它上面时只是改变颜色,并且在活动链接上有不同的颜色,但是每当我将鼠标悬停在一个链接上时它会向上移动连接。我也无法让css的活跃poart工作。 任何建议。

div.InnerRight {
width: 7px;
float: right;
margin-right: 10px;
}

div.content {
line-hieght: 100%;
font-family: Arial,Helvetica,sans-serif;
font-size: 13px;
font-weight: bold;
color: rgb(255, 255, 255);
margin-left: 10px;
}

td.nav {
vertical-align: middle; cursor: pointer;
background: rgb(160, 182, 226);
line-height: 150%;
}

td.nav:hover {
vertical-align: top;
background: rgb(25, 56, 121);
line-height: 150%;
text-decoration: underline;
color: white;
}

td.nav:active {
vertical-align: top;
background: rgb(25, 56, 121);
line-height: 150%;
text-decoration: none;
color: white;
}
<table style="text-align: left; width: 111px; height: 13px;"border="0" cellpadding="0" cellspacing="8">
<tbody>
<tr>
<td class="nav"onclick="document.location.href='http://betawestsussexurologyllp.weebly.com/';">
<div class="InnerRight">
<img class="dot"alt="dot"src="http://www.weebly.com/uploads/5/7/5/9/5759838/custom_themes/615015250510160105/files/dot.png?36558"><br></div><div class="content">Home<br>
</div></td></tr></tbody></table>

1 个答案:

答案 0 :(得分:2)

内容移动是因为您在悬停与非悬停时vertical-align的值不同。