Ссылка показывает, но на самом деле не ссылка внутри позиционного div в IE - PullRequest
Новая
       9

Ссылка показывает, но на самом деле не ссылка внутри позиционного div в IE

0 голосов
/ 28 октября 2009

Вы можете увидеть сайт на Emeraldcityguitars.com, ссылки - это названия Spotlight в новых и Vintage Spotlight пространствах внизу. ссылка на изображение, но текст заголовка продукта - нет.

Я думаю, проблема в том, что он содержится в z-indexed div, но я не понимаю, почему это сломало бы ссылку.

Помощь ... 

 <div id="vintage_spotlight">
    <% if @vintage_spotlight.blank? %>

    <% else %>
    <div id="vintage_image">
        <%= link_to (image_tag @vintage_spotlight.front_photo.data.url(:spotlight)), @vintage_spotlight %>
        <div id="vintage_image_title"><%= link_to @vintage_spotlight.title, @vintage_spotlight, :class => 'spotlight_link' %></div>
    <% end %>
</div>

И CSS ... 

#vintage_spotlight{
float:right;
background-image:url(/images/vintage_spotlight_bg.png);
background-repeat:no-repeat;
height:265px;
width:257px;
margin-right:34px;}

#vintage_spotlight a{color:#fff;}

#vintage_image{
padding:40px 0 0 8px;
position:relative;}

#vintage_image_title{
position:absolute; 
bottom:0px; 
right:10px;
height:26px;
width:160px;
padding:10px 0 0 3px;
background-image:url(/images/spotlight_overlay.png);
background-repeat:no-repeat;
color:#fff;
font-size:12px;
z-index:100; }

.spotlight_link{
position:relative;
z-index:200;}

есть мысли?

Ответы [ 2 ]

0 голосов
/ 29 октября 2009

Как я вижу, ссылка внутри: 

<div id="vintage_image">

, который обернул изображение, после визуализации получает высоту 0.

Пожалуйста, проверьте, есть ли какой-либо javascript, который изменяет стиль ссылок.

0 голосов
/ 29 октября 2009

Не совсем ответ, но так как никто больше не ответил ...

Когда я загружаю эту страницу в IE8 (все, что у меня есть), ссылки сначала работают, а затем текст меняется (буквально, шрифт меняется) и ссылки деактивируются.

Так что, на мой взгляд, что-то мешает вашему CSS. Может быть, это JS или другой элемент, перекрывающийся и вызывающий проблемы. Я хотел бы предложить следующие шаги по устранению неполадок. Используйте новую страницу в вашей среде разработки.

  1. Работа только с этой ссылкой, ее контейнером и JS / CSS, связанными с этими двумя элементами. Сузьте то, с чем вы работаете.
  2. Обратите внимание на позицию, z-index и float. Попробуйте удалить их, если это возможно, так как они являются единственными подозрениями, которые у меня есть в настоящее время.
  3. Если вы подтверждаете, что CSS не является проблемой, то, вероятно, ваша проблема связана с помехами JS. Я бы предложил опубликовать еще один вопрос для решения этой проблемы.
...