2011-03-05 88 views
0

我想要一个菜单​​,只需将鼠标悬停在其上并在活动链接上具有不同的颜色,但每当我将鼠标悬停在链接上时,它都会向上移动contnet。我也无法获得CSS的主动权。 任何建议。如何阻止div移动时悬停

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> 
+0

现场示例? [在JS Fiddle,也许](http://jsfiddle.net/)? – 2011-03-05 16:49:33

+0

它看起来像你明确告诉内容移动 - 你有这悬停:vertical-align:top;这在非悬停状态:vertical-align:middle; - 拿出来看看它是否能解决你的问题。 – jpea 2011-03-05 16:52:01

回答

2

内容可以移动,因为你有vertical-align悬停与非悬停不同的值。