IE에서 위치가 지정된 div 내부에 링크가 표시되지만 실제로 링크되지 않습니다

Question

Emeraldcityguitars.com에서 사이트를 볼 수있는 링크는 하단의 신규 및 빈티지 스포트라이트 공간에있는 스포트라이트 제목입니다. 이미지 링크지만 제품 제목 텍스트는 그렇지 않습니다.

저는 문제가 Z- 인덱스 된 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;} 

어떤 생각이? 정말

Answer 1

하지 대답,하지만 아무도 대답하지 않기 때문에 ...

내가 IE8에서이 페이지를 (그 모두가 내가 가진) 링크가 처음 작동 한 후 텍스트가 변경 (문자, 글꼴 변경로드

) 링크가 비활성화됩니다.

내 의견으로는 뭔가 CSS에 간섭하고 있습니다. 어쩌면 JS 또는 다른 요소가 겹쳐서 문제를 일으킬 수 있습니다. 다음 문제 해결 단계를 제안합니다. dev 환경에서 새 페이지를 사용하십시오.

1. 해당 링크, 해당 컨테이너 및 해당 두 요소와 관련된 JS/CSS 만 사용하십시오. 당신이 일하는 것을 좁히십시오.
2. 위치, z- 색인 및 수레에주의하십시오. 그들이 현재 가지고있는 유일한 의문이므로 가능한 한 제거하십시오.
3. CSS가 문제가 아니라고 확인하면 문제는 JS 간섭 일 것입니다. 나는 그것을 해결하기 위해 또 다른 질문을 게시 할 것을 제안 할 것이다.

Answer 2

I에서 볼 수 있듯이, 내부 링크 :

<div id="vintage_image"> 

화상 래핑 한번 렌더링 높이 0 얻는다.

링크 스타일을 수정하는 자바 스크립트가 있는지 확인하십시오.