- From: Gérard Talbot <css21testsuite@gtalbot.org>
- Date: Thu, 9 Feb 2012 21:16:51 -0500
- To: "Arron Eicholz" <Arron.Eicholz@microsoft.com>
- Cc: "L. David Baron (dbaron@dbaron.org)" <dbaron@dbaron.org>, "fantasai (fantasai@inkedblade.net)" <fantasai@inkedblade.net>, "www-style mailing list" <www-style@w3.org>, "Public CSS testsuite mailing list" <public-css-testsuite@w3.org>, "Bruno Fassino" <fassino@gmail.com>
Le Mar 28 décembre 2010 12:06, Arron Eicholz a écrit : > http://test.csswg.org/suites/css2.1/20101210/html4/margin-collapse-164.htm > http://test.csswg.org/suites/css2.1/20101210/html4/margin-collapse-clear-005.htm > http://test.csswg.org/suites/css2.1/20101210/html4/margin-collapse-clear-011.htm > > These test cases exhibit a margin collapse behavior that we have > discussed many times, however after some extensive review it seems as if > the cases themselves are incorrect per the current spec. These cases > should be updated to match the latest spec. > > Section 9.5.2 states: > Computing the clearance of an element on which 'clear' is set is done by > first determining the hypothetical position of the element's top border > edge within its parent block. This position is where the actual top > border edge would have been if the element had a non-zero bottom border > and its 'clear' property had been 'none'. > > Using margin-collapse-164 as our example case... > > <style type="text/css"> > > .outer { margin: 1em; background: red; height: 4.5em; } > > .border { border: solid; width: 10em; } > > .box { margin: 0; background: yellow; } > > .float { margin: 0; width: 5em; height: 1.5em; background: orange; > float: right; } > > .clear { margin-top: 3em; height: 1.5em; background: aqua; clear: > both; } > > .control { border: solid; width: 10em; background: yellow; margin: > 1em; } > > .control .a { margin: 0 0 0 auto; width: 5em; height: 1.5em; > background: orange; } > > .control .b { margin-top: 1.5em; height: 1.5em; background: aqua; } > > </style> > > <div class="outer border"> > <div class="box"> > <div class="float">TEST</div> > <div class="clear">TEST</div> > </div> > </div> > <div class="control"> > <div class="a">TEST</div> > <div class="b">TEST</div> > </div> > > Based on section 9.5.2 we first calculate the hypothetical position, > within its parent block, of div "clear". We collapse the top margin of > "clear" with "box" which puts the "clear" element's top position at 0. > We then place the div "float" into the mix. Div "float" element's top > position is also at 0 which will trigger the "clear" element to clear > since the two intersect. > > Since we now clear it will look as if the "clear" element's margin was > completely ignored (in reality you end up with negative clearance). Thus > the "clear" element will be touching the bottom of the "float" element. > > Currently all browsers I have tested in Windows, IE8, IE9, > Firefox3.6.13, Firefox 4b8, Opera 11, Safari 5.0.3, Chrome 8.0.552.224, > Konquerer 4.4.0 all exhibit the same visual result. This means that we > all are in compliance to what the spec states today. However the tests > assume a different behavior. > > In trying to identify a fix that would match what the tests expected we > discovered this issue and an additional one... > > Once we had a satisfactory fix for the case we discovered an new issue > with the updated behavior resulting in a change to the Acid2 test. > Though the behavior within the Acid2 test is partially hidden due to > overlapping elements; if the Acid2 test is broken down into individual > rows there is an obvious behavior change to the layout of the "smile" > section of Acid2. > > After all of this analysis, and attempted fix to the solution, it seems > as if all the browsers have the correct solution today and there is no > need to change the spec further to match what the tests are trying to > accomplish. I believe we need to change the tests so elements can have > negative clearance (resulting in a visual appearance that the cleared > elements move up). This will also mean that implementations do not need > to make a change in this area and potentially break sites on the web > that may have this situation of float, margin and clear. Hello, What is the final word on [RC6] http://test.csswg.org/suites/css2.1/20110323/html4/margin-collapse-164.htm ? As far as I can see and as far as I'm concerned, margin-collapse-164 is invalid. Also, in "Re: contradictions between clearance tests" (30 nov. 2010) http://lists.w3.org/Archives/Public/public-css-testsuite/2010Dec/0008.html fantasai wrote: " Gérard will have to evaluate his margin-collapse-clear-014. " As far as I can see http://test.csswg.org/suites/css2.1/20110323/html4/margin-collapse-clear-014.htm is still valid and still correct (always was valid and correct too). Gérard +CC: Bruno Fassino -- Contributions to the CSS 2.1 test suite: http://www.gtalbot.org/BrowserBugsSection/css21testsuite/ CSS 2.1 Test suite RC6, March 23rd 2011: http://test.csswg.org/suites/css2.1/20110323/html4/toc.html CSS 2.1 test suite harness: http://test.csswg.org/harness/ Contributing to to CSS 2.1 test suite: http://www.gtalbot.org/BrowserBugsSection/css21testsuite/web-authors-contributions-css21-testsuite.html
Received on Friday, 10 February 2012 02:17:39 UTC