HTML href mit css dh Problem

Question

<style type="text/css">
.web\_westloh {
background-image: url(images/web\_westloh.png);
background-repeat: no-repeat;
height: 100px;
width: 350px;
}
.web\_westloh:hover {
border-bottom-width: 2px;
border-bottom-style: dashed;
border-bottom-color: #999999;
padding-bottom: 5px;
}
.web\_money {
background-image: url(images/web\_money.png);
background-repeat: no-repeat;
height: 100px;
width: 350px;
}
.web\_money:hover {
border-bottom-width: 2px;
border-bottom-style: dashed;
border-bottom-color: #999999;
padding-bottom: 5px;
}
</style>

<a href="http://www.westloh.com" title="Click to Visit http://www.westloh.com" target="\_blank" class="web\_westloh">
  <div class="web\_westloh"></div>
</a>
<a href="http://www.money-mind-set.com" title="Click to Visit http://www.money-mind-set.com" target="\_blank">
  <div class="web\_money"></div>
</a>

Das Problem ist:
In Mozilla ist die Verlinkung in Ordnung. Kein Problem.
Aber im IE ist der Link ein Problem, er wird nicht mit dem Ziel verknüpft.

Auf dieser Seite finden Sie das Problem: http://replytowest.com --> am unteren Rand.

Dankeschön

Answer 1

Erstens, ein a ist ein Inline-Element. A div ist ein Element der Blockebene. Elemente der Blockebene sind keine gültigen Kinder von Inline-Elementen.

Schließlich ist die div ist völlig überflüssig.

Machen Sie einfach etwas wie:

<style>
a.button, a.button:link, a.button:visited {display: block; width: 350px; height 100px;}
a.button:hover, a.button:active {
  border-bottom-width: 2px;
  border-bottom-style: dashed;
  border-bottom-color: #999999;
  padding-bottom: 5px;
}

a.web_westloh {
  background-image: url(images/web_westloh.png);
  background-repeat: no-repeat;
}

a.web_money {
  background-image: url(images/web_money.png);
  background-repeat: no-repeat;
}

</style>

<a class="button westloh" href="http://www.example.com" title="link title"></a>
<a class="button web_money" href="http://www.example.com" title="link title"></a>

Answer 2

Putting <div> innerhalb <a> ist ungültiges HTML ( a ist ein Inline-Element, div ist ein Element auf Blockebene). Ersetzen Sie das div durch ein span, das den Wert display: block .

Wahrscheinlich kein Zusammenhang, aber die onclick Handler sollte false zurückgeben, damit die Seite nicht in zwei Fenstern gleichzeitig geöffnet wird.

Answer 3

Fügen Sie dies zu Ihrem Stylesheet hinzu:

#content_sub_text a {
    position: relative;
    cursor: pointer;
}

Answer 4

Setzen Sie das a href-Tag innerhalb des div-Tags. Das sollte das Problem lösen.

Answer 5

Ich weiß nicht, ob dies Ihr Problem lösen wird, aber es können seltsame Dinge passieren, wenn Sie ein völlig leeres Div haben. Versuchen Sie, ein einzelnes   innerhalb der <div> Tag und sehen Sie, ob das hilft.