Closed
Bug 186581
Opened 23 years ago
Closed 23 years ago
Absolutely positioned elements within table cells rendered incorrectly
Categories
(SeaMonkey :: General, defect)
Tracking
(Not tracked)
People
(Reporter: hughw, Assigned: asa)
Details
Attachments
(1 file)
|
1.87 KB,
text/html
|
Details |
User-Agent: Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; Q312461; .NET CLR 1.0.3705)
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.2.1) Gecko/20021130
<html>
<title>Bug: CSS absolute positioning in <table></title>
<body>
<!-- leave some whitespace at the top so we can see the effect -->
<div style="left: 100; top: 80; height: 200; width: 200"/>[this space
intentionally left (almost) blank]</div>
<h1>
Mozilla 1.2.1 renders absolutely positioned elements within table cells
incorrectly
</h1>
There is a table below having one cell. The cell contains a <div>
containing the letter "A".
The <div> has style "position: absolute; left: 0; top: 0;".
Its containing <table> has style style="position:relative; left:
300; top: 300;".
The
<a href=http://www.w3.org/TR/REC-CSS2/visudet.html#containing-block-
details">CSS 2 spec</a> (section 10.1 Definition of "containing
block")
says the <table> must be the containing block because it is the ancestor
that has positioning of
type "relative" or "absolute". Its upper left corner
should be the origin for the
absolutely positioned <div>. However, in Mozilla 1.2.1 Gecko/20021130
(Windows XP sp1)
the green "A" appears at the top left of the whole page,
positioned incorrectly.
<table style="position:relative; left: 300; top: 300; border: 2px solid
black;" >
<tr>
<td>
<div style="position:absolute; left: 0; top: 0; font-size:36pt; color:
green">A</div>
</td>
</td>
</table>
The same effect happens when we try to make the containing block the
<td>: see the blue "A".
<table style="position:relative; left: 300; top: 300; border: 2px solid
black;>
<tr>
<td style="position:absolute; left: 0; top: 0;">
<div style="position:absolute; left: 100; top: 0; font-size: 36pt;
color: blue">A</div>
</td>
</tr>
</table>
Contact: <a href="mailto:hwinkler99@yahoo.com">Hugh Winkler </a>
Reproducible: Always
Steps to Reproduce:
make a file with the html from the Details section :)
Actual Results:
the green "A" appears at the top left of the whole page, positioned
incorrectly.
Expected Results:
the A should appear below the text, within the <table>
|
Reporter | |
Comment 1•23 years ago
|
||
*** This bug has been marked as a duplicate of 63895 ***
Status: UNCONFIRMED → RESOLVED
Closed: 23 years ago
Resolution: --- → DUPLICATE
|
||
Updated•21 years ago
|
Product: Browser → Seamonkey
You need to log in
before you can comment on or make changes to this bug.
Description
•