相关疑难解决方法(0)

firefox位置绝对在一个相对容器问题里面

我使用表来显示我动态生成的数据取决于用户输入html结构如下所示:

<table>
<tr>
    <td>.....</td>
    <td>.....</td>
    <td style="position:relative;"> //like this i set for all td in table
     <div style="position:absolute">//like this i set for all div in table
     <contents>
     </div>
   </td>
   <td>.....</td>
   <td>.....</td>
</tr>
</table>
Run Code Online (Sandbox Code Playgroud)

这里的div是到了body的顶角.所有这些上面的样式都应用于javascript和它在chrome,IE中的工作正常,但不在FF中,如下图所示.

在此输入图像描述

如果我们将div的位置更改为绝对到相对它将正确对齐,但我做一个悬停效果,而用户悬停div的位置是重要的,这个问题只发生在firefox

为了您的快速参考,请查看jquery http://www.malsup.com/jquery/hoverpulse/

我需要这样必须在FIREFOX表中实现,这意味着

  • 每个图像放在一个td内//<td style="position:relative;">

  • 如果用户将鼠标悬停在td上,则图像应该脉冲(缩放效果).

  • 当用户将鼠标悬停时,它应该进入之前的状态.(正常大小)

表格结构已在上面给出.

html firefox position

27
推荐指数
3
解决办法
3万
查看次数

在firefox和chrome中绝对定位的问题

我不明白为什么FF和Chrome以不同的方式呈现我的页面.这是一个它的屏幕

firefox:firefox示例http://grab.by/65Bn

这是Chrome中的一个

chrome:chrome示例http://grab.by/65BB

fieldset具有相对位置,图像具有绝对位置.

这是基本结构:

<fieldset class="passenger-info">
  <legend>Passenger 1</legend>
  <div class="remove-me">
    <img src="/images/delete-icon-sm.png" />
  </div>
</fieldset>
Run Code Online (Sandbox Code Playgroud)

基本上图像是在图例之后声明的.

这是fieldset的css:

.passenger-info {
  background:none repeat scroll 0 0 #F2F2F2;
  border:1px solid #9D240F;
  display:inline;
  float:left;
  margin-bottom:10px;
  margin-right:10px;
  padding:3px 10px;
  position:relative;
  width:350px;
}
Run Code Online (Sandbox Code Playgroud)

并为我删除图像:

.remove-me {
  border:1px solid red;
  position:absolute;
  right:0;
  top:0;
}
Run Code Online (Sandbox Code Playgroud)

这很奇怪.我尝试将字段集填充,并且图像向上移动了一点,但仍然没有在角落.

这篇文章表明FF确实在渲染场集方面存在问题.

http://www.codingforums.com/showthread.php?t=132624

有没有更好的方法来修复而不使用浏览器特定的黑客攻击?

html css firefox google-chrome css-position

22
推荐指数
2
解决办法
5万
查看次数

标签 统计

firefox ×2

html ×2

css ×1

css-position ×1

google-chrome ×1

position ×1