css样式弹出层在不同浏览器下显示位置不同
我做了一个css弹出层显示大图和详细信息，在ie6，搜狗浏览器下显示是正常的：
但是在其它浏览器就变成下面这样：
代码如下：
<style type="text/css">
/*Tooltips*/
.tooltips{ position:relative; /*这个是关键*/ z-index:2; }
.tooltips:hover{ z-index:3; background:none; /*没有这个在IE中不可用*/ }
.tooltips span{ display: none; }
.tooltips:hover span{
/*span 标签仅在 :hover 状态时显示*/
display:block;
position:absolute;
top:2px;
left:1px;
width:220px;
border:1px solid black;
background-color:#FFFFFF;
padding: 3px;
color:black;
}
</style>
<asp:DataList ID="DataList1" runat="server" RepeatColumns="9" RepeatDirection="Horizontal" CellSpacing="9">
<ItemTemplate>
<a class="tooltips" href="#tooltips">
<img src="images/<%#Eval("product_img") %>" width="100px" height="100px" style="border: 0" alt="css式样弹出层在不同浏览器下显示位置不同" />
<span>
<table>
<tr>
<td>
<img src="images/<%#Eval("product_img") %>" style="border: 0" width="212px" height="212px" alt="css式样弹出层在不同浏览器下显示位置不同" />
</td>
</tr>
<tr>
<td>
<a href="aaa.aspx?productid=<%# Eval("Product_id") %>&&str=首页" target="_blank" style="text-decoration: none; font-size: 13px; color: #0063DC;">
<%#Eval("product_name") %>
</a>
</td>
</tr>
<tr>
<td>
<a href="javascript:void(0)" style="text-decoration: none; font-size: 14px; color: #FF6600; font-weight: bold">￥<%#Eval("product_price") %></a>
</td>
</tr>
</table>
</span></a>
</ItemTemplate>
</asp:DataList>
要怎么改才能让弹出的层在任何浏览器下都和第一张图片一样显示？
[解决办法]
一般这样的问题
我会给2个浏览器不同的样式达到一样的效果
然后问题原因就找到了
