2011-03-05 144 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懸停與非懸停不同的值。