Незакрепляемый анкерный тег

Я использую этот html-код

 

и по какой-то причине link2 не link2 (нет курсора)

CSS:

 .titleIn { direction: rtl; margin-bottom: 10px; margin-right: 0; margin-top: -10px; position: relative; text-align: right; z-index: -1; } 

Есть идеи?

Я не могу сказать, что знаю, почему , но я знаю, что вызывает это: Ваш z-index: -1 . Если вы удалите это, проблема исчезнет (по крайней мере, для меня это касается Chrome, Firefox и Opera, но не для IE6 или IE7). Вот живая копия вашего примера и вместо этого обновленная копия с z-index: 0 .

Предоставляя ему z-index меньше нуля, вы помещаете его ниже основного содержимого streamа, и я думаю, что документ не пропускает это событие (как и любой элемент с непрозрачной настройкой фона).

Кажется, что у IE есть отдельная проблема с комбинацией direction: rtl; и position: relative; , но я думаю, что это отдельный вопрос. Если я .titleIn каждый стиль в .titleIn кроме direction: rtl; position: relative; direction: rtl; position: relative; , IE все еще ломается (ссылка не подвержена сомнению). Если я удалю любой из них, IE начнет работать (но, конечно, ваш макет не делает то, что вы хотите).

Если вы не сделали z-index тела < -1, вы по существу помещаете ссылку по всему телу страницы, конечно, это не щелчок. (Элементы, такие как тело и заголовки, будут охватывать всю ширину, которую он определен, тем самым незаметно блокируя другие элементы, которые могут быть видны, но не доступны для нажатия)

Если вы использовали Firebug, это будет хорошо иллюстрировать это, выделив область тега.

Ну, когда я пытаюсь это сделать в IE, ссылка становится активной только после удаления position: relative; и margin-top: -10px; , Soooo, вам действительно нужна позиция: родственник? 🙂