HTML HREF с CSS, то есть проблема - PullRequest
Новая
       13

HTML HREF с CSS, то есть проблема

3 голосов
/ 14 мая 2010 
<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"&gt</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>


Проблема в следующем:
В Mozilla ссылки в порядке. Нет проблем.
Но в IE ссылка является проблемой, она не будет ссылаться на цель.

См. Эту страницу, чтобы увидеть проблему: http://replytowest.com -> внизу.

Спасибо

Ответы [ 6 ]

4 голосов
/ 14 мая 2010

Прежде всего, a является встроенным элементом. A div является элементом уровня блока. Элементы блочного уровня не являются допустимыми дочерними элементами встроенных элементов.

Наконец, div совершенно не нужен.

Просто сделайте что-то вроде: 

<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>
3 голосов
/ 14 мая 2010

Добавьте это к вашей таблице стилей: 

#content_sub_text a {
    position: relative;
    cursor: pointer;
}
3 голосов
/ 14 мая 2010

Помещение <div> внутрь <a> - недопустимый HTML (a - встроенный элемент, div - элемент уровня блока). Замените div с диапазоном, который имеет display: block.

Вероятно, не связано, но обработчик onclick должен возвращать false, чтобы не открывать страницу в двух окнах одновременно.

1 голос
/ 14 мая 2010

Поместите тег href в тег div. Это должно это исправить.

0 голосов
/ 14 мая 2010

Дать дисплей: блок; к свойству ссылки ..

Надеюсь, это поможет
Авинаш

0 голосов
/ 14 мая 2010

Я не знаю, решит ли это вашу проблему, но странные вещи могут случиться, если у вас полностью пустой div. Попробуйте поместить один &nbsp; в тег <div> и посмотрите, поможет ли это.

...