Side navigation
#8197 closed bug (wontfix)
Opened February 07, 2011 04:04PM UTC
Closed February 08, 2011 12:04AM UTC
Last modified March 14, 2012 02:00PM UTC
.offsetParent() returns wrong element in Firefox
Reported by: | jdege@jdege.us | Owned by: | |
---|---|---|---|
Priority: | low | Milestone: | 1.next |
Component: | offset | Version: | 1.5 |
Keywords: | Cc: | ||
Blocked by: | Blocking: |
Description
.offsetParent() is supposed to return the nearest positioned element, where "positioned" means it has a css position attribute of "relative", "absolute", or "fixed".
The problem is that in Firefox "position:relative" is ignored, when applied to table elements. A <td> element is never "positioned", even if it does have a position:relative css attribute. Yet JQuery's .offsetParent() returns the <td>, and .offset() returns coordinates relative to the <td>.
In IE8, "position:relative" in a <td> is processed, .offsetParent() returns the <td> and .offset() returns coordinates relative to the <td>.
In other words, JQuery behaves the same for both browsers. But since Firefox is handling the <td> very differently, it shouldn't.
The result is that using .offset on elements within a position:relative <td> returns incorrect values, and attempts to place position:absolute elements based on those values will draw them in the wrong position.
Example:
Tested with:
JQuery version 1.5
JQuery version 1.4.4
Firefox 3.6.13 on Linux
Firefox 3.6.13 on Windows
IE 8.0.7600.16385 on Windows
Attachments (0)
Change History (1)
Changed February 08, 2011 12:04AM UTC by comment:1
component: | unfiled → offset |
---|---|
priority: | undecided → low |
resolution: | → wontfix |
status: | new → closed |
You really shouldn't be trying to
position: relative
a td, that doesn't make much sense.Your test case already includes the correct way to go about this (including a div with position relative inside the td).
The CSS specification say the following in the positioning schemes section:
>The effect of 'position:relative' on table-row-group, table-header-group, table-footer-group, table-row, table-column-group, table-column, table-cell, and table-caption elements is undefined.