0 
<div>
<ul class="ulCont">
<li><a href="#nogo">Sky</a></li>
<li><a href="#nogo">Sea</a></li>
</ul>
<img class="thinker01" src="images/thinker01.png"/>
<div class="clearBoth"></div>
</div>

CSS 

.ulCont{float:left;}
.thinker01{float:right;}
.thinker01:hover{margin-top:-5px;}
.clearBoth{clear:both;}

Firefox および Chrome - 正常に動作します。つまりimg、マウスオーバーで移動し、そのul場所にとどまります。
IE8 - マウスオーバー時-上マージン -5px までimg移動します。 それで、誰かが IE の生産を禁止することができますか?ul

4

3 に答える 3

1

私はあなたが私にくれたものをjsfiddleにしました。あなたが話していることを、3つのブラウザすべてで試しました。-5pxあなたが言ったように、それらはすべてホバーで上に移動します。

于 2012-12-13T20:33:45.823 に答える
1

ホバーのためにIE8で動きがありませんでした。これは、ホバーが IE で機能するのは、href を持つ「a」タグに対してのみであるためです。

W3Schools は、適切な DOCTYPE で動作させることができると言っていますが、どの DOCTYPE かはわかりません。 http://www.w3schools.com/cssref/sel_hover.asp

画像の周りに a タグを追加できます。

<a href="#nogo" class="thinker01"><img src="images/thinker01png_round_coaster.jpg"/></a>

で境界線を削除します

.thinker01 img {border: none;}

この余分な「a」が他の問題を引き起こす可能性があることは理解していますが、それが解決策の始まりになる可能性があります。

于 2012-12-13T20:50:43.983 に答える
1

これはすべてのブラウザーで機能することがわかりました。チェックしてください 

<div>
<ul class="ulCont">
<li><a href="#nogo">Sky</a></li>
<li><a href="#nogo">Sea</a></li>
</ul>
<div style="clear:right;"></div> // this line is added
<img class="thinker01" src="images/thinker01.png"/>
<div class="clearBoth"></div>
</div>
于 2012-12-13T20:58:10.363 に答える