0

您可以在 Emeraldcityguitars.com 上查看该网站，链接是底部 New 和 Vintage Spotlight 空间中的 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;}

有什么想法吗？

4

2 回答 2

0

As I can see, the link inside: 

<div id="vintage_image">

that wrapped the image gets a height 0 once rendered.

Please check if there is any javascript that modifies the links style.

于 2009-10-29T03:50:45.287 回答
0

不是真正的答案，但因为没有其他人回答......

当我在 IE8 中加载此页面（我拥有的全部）时，链接首先工作，然后文本更改（字面意思是字体更改）并且链接停用。

所以在我看来，有些东西干扰了你的 CSS。也许是 JS 或其他元素重叠并导致问题。我会建议以下故障排除步骤。在您的开发环境中使用新页面。

  1. 仅使用该链接、其容器以及与这两个元素关联的 JS/CSS。缩小你正在使用的范围。
  2. 注意位置、z-index 和浮点数。如果可能，请尝试删除它们，因为它们是我目前唯一的怀疑。
  3. 如果您确认 CSS 不是问题，那么您的问题可能是 JS 干扰。我建议发布另一个问题来解决这个问题。
于 2009-10-29T03:18:57.100 回答