0

我的名字是垂直显示的。基本上这是我的html页面的结构。

<div>                                  <div/>
  <a>name<span>Details</span></a>          <a>name<span>Details</span></a>      
  <a>name<span>Details</span></a>         <a>name<span>Details</span></a>
</div>                                 </div>

因此，每个“a”标签都包含一个名称，而 span 标签包含有关该名称的详细信息。span 标签的显示属性设置为“none”开始，当鼠标悬停在“a”标签内容上时更改为“block”。问题是跨度标记内容在 IE8 中被截断。在 Firefox 和 chrome 中运行良好。

我的 CSS 文件：

#tooltip1 { position: relative; }
#tooltip1 a{text-decoration: none; color:#000000;} 
#tooltip1 a span { display: none; color: #FFFFFF; }    
#tooltip1 a:hover span { display: block; position: absolute; 
                         background-color: #aaa; color: #FFFFFF; 
                         padding: 5px; height: 10px; 
                         width:500px; }

我将鼠标悬停在这张图片中的“OMA”上，而不是显示“OMAHA NEBRASKA”，它只显示“OMAHA” 我该怎么做才能让 IE 显示所有文本？我曾尝试使用“溢出”属性，但没有奏效。

它在我的系统中的样子的图片

这是 jsfiddle 的链接，如果想查看所有代码，请查看 http://jsfiddle.net/7s4Np/10/

4

2 回答 2

1

尝试将 z-index 应用于 a:hover span

#tooltip1 a:hover span{ z-index:5; }

我认为工具提示隐藏在流程中的下一个相关元素后面，并且其中包含不透明的背景颜色。

于 2012-11-01T16:53:39.107 回答
0

问题在于应用于 div 标签的 .container 类的 css。尽管我在这里的问题没有显示应用 .container 类的 div，但它在我发布的 jsfiddle 链接中显示了这一点。

这就是问题所在： 

.container {width: 100px; float: left; overflow: hidden; padding: 10px;}

我删除了“溢出：隐藏”属性，它就像一个魅力。

在我之前解决此问题的尝试中，我已将“溢出：可见”应用于子元素（跨度标记）。子元素中的值（溢出：可见）是否应该超过父元素中定义的值（溢出：隐藏）？

无论如何，谢谢你们所有的时间。

于 2012-11-02T16:49:28.927 回答