Firefox не показывает ссылку на мое изображение как полную ссылку

Question

Итак, у меня есть изображение между двумя тегами привязки.CSS для изображения: ..

#howDoesItWork {
position: absolute;
height: 31px;
width: 154px;
    border-style: none;
top: 3px;
left: 20px;
}

правильные 20 пикселей изображения не замечены как ссылки в Firefox.Он отлично работает в IE.Я попытался изменить его на отступ слева: 20px и margin-left: 20px.Он по-прежнему показывает, что последние 20 пикселей не являются частью ссылки.Это работает нормально, но я полностью убираю позиционирование.

<a id="howDoesItWork" href="">
<img src="images/howDoesItWork.jpg" alt=""/>
</a>

ИСПРАВЛЕНО: Я установил z-index на 2. Видимое меню рядом с ним перекрывалось с образом howDoesItWork.

Answer 1

Когда вы устанавливаете изображение в абсолютном положении, ссылка не использует изображение, чтобы основывать его ширину.

Поскольку вы установили значение left: 20px, оно будет перекрывать диапазон ссылки.

Так что вам нужно расширить зону действия ссылки. Не зная ничего о вашем документе (то есть о столбцах, о том, что вы пытаетесь сделать), мой лучший выбор:

a #howDoesItWork { padding-right: 20px; }

Если этого не происходит ... просто покажите нам больше информации.

UPDATE

С новой информацией html она должна быть:

#howDoesItWork { padding-right: 20px; }