css - Internet Explorer の水平コーダ ナビゲーションの位置がずれている

Question

Firefox / Chrome / Safari では画像全体をクリックできますが、Internet Explorer では画像の右側のみをクリックできます。

http://www.dawaf.co.uk/cthm/work/

Javascript

<script type="text/javascript">
  $().ready(function() {
    $(".slider1").codaSlider( {dynamicArrows: false, dynamicTabs: false} );        $(".slider1 .coda-nav-right-wrapper").mouseover(function() {
      $(".nav1").css("display","block");
    });
    $(".slider1 .coda-nav-right-wrapper").mouseout(function() {
      $(".nav1").css("display", "none");
    });
    $("#coda-nav-right-1 > a > .coda-nav-right-wrapper").mouseover(function() {
      $(".caption1").css("display", "inline");
    });         

    $("#coda-nav-right-1 > a > .coda-nav-right-wrapper").mouseout(function() {
      $(".caption1").css("display", "none");
    });
  });
</script>

CSS

#content .coda-nav-right-wrapper {
  display: block;
  position: absolute;
  left: 0px;
  top: 0px;
  z-index: 40;
  width: 900px;
  height: 450px;
  cursor: pointer;
}

Answer 1

<div>インライン要素内にブロック レベル要素があります<a>。これは IE では意味的に有効ではありません。したがって、タグにdisplay: block;orfloat: left;を指定すると、修正されます。<a>