Closed Bug 691270 Opened 11 years ago Closed 11 years ago

table with negative margin-top moves parent instead of overlapping the parent

Categories

(Core :: Layout: Block and Inline, defect)

10 Branch
x86
Windows XP
defect
Not set
normal

Tracking

()

RESOLVED INVALID

People

(Reporter: dellamowica, Unassigned)

References

Details

Attachments

(3 files)

User Agent: Mozilla/5.0 (Windows NT 5.1; rv:10.0a1) Gecko/20111002 Firefox/10.0a1
Build ID: 20111002030844

Steps to reproduce:

I have this:

<div class="box">
     <div class="top"> </div>
     <div class="body"> 
        <ul>
           <li> text 1 </li>
           <li> text 2 </li>
        </ul>
     </div>
</div>

ul, li {
 margin:0;
 padding:0;
}

.top {
 height:20px;
 background:red;
}

.body{
 background:white;
}

.body ul {
 margin-top:-20px;
}


Actual results:

the ".body" element overlapped the ".top" element


Expected results:

the ".body" element didn't use to move, only the UL should overlap ".top".
That's what the previous versions of firefox used to do anyway.
I see the same rendering of this in Firefox 7, 10 and IE 8. Can you attach a screenshot of how it looks in "previous versions Firefox"?
Component: General → Layout: Block and Inline
Product: Firefox → Core
QA Contact: general → layout.block-and-inline
Does this testcase show the bug for you?
In the original attached testcase, the .body is empty, so its top margin collapses with the top margin of its kid.  The expected rendering in that testcase, implemented in every single modern browser (and that includes Firefox back to at least Firefox 2) is to not have any red visible.
Status: UNCONFIRMED → RESOLVED
Closed: 11 years ago
Resolution: --- → INVALID
Sorry my previous input was stripped down and didn't make the bug appear. This does.
Attachment #564206 - Attachment mime type: text/plain → text/html
Here, Firefox 7 renders rounded red corners on top and also background behind "Titre" si red. In Firefox 10 the background is white. That is also what IE 8 shows for me. Maybe Firefox just got fixed?
Status: RESOLVED → REOPENED
Ever confirmed: true
Resolution: INVALID → ---
Ah, thanks.

Yes, table borders used to not collapse correctly and now do.  Ehsan made that change in one of his recent patches.

So I believe the new rendering is in fact correct.  Ehsan, can you confirm?
Summary: box with negative margin-top moves parent instead of overlapping the parent → table with negative margin-top moves parent instead of overlapping the parent
Yes.  aceman, this was a very old bug in Firefox which I fixed last week (bug 87277, but see bug 659828 for the actual fix).  Now, Firefox's behavior is the same as all of the other browser engines.  :-)
Status: REOPENED → RESOLVED
Closed: 11 years ago11 years ago
Resolution: --- → INVALID
Blocks: 691591
Thank you guys for your time! Keep up the good work :)
You need to log in before you can comment on or make changes to this bug.