- From: Alan Stearns <stearns@adobe.com>
- Date: Thu, 13 Sep 2012 14:50:18 -0700
- To: "www-style@w3.org" <www-style@w3.org>
- CC: Andrei Bucur <abucur@adobe.com>, "hyatt@apple.com" <hyatt@apple.com>, "Tab Atkins Jr." <jackalmage@gmail.com>
On 9/7/12 9:42 AM, "Tab Atkins Jr." <jackalmage@gmail.com> wrote: >On Fri, Sep 7, 2012 at 9:13 AM, Alan Stearns <stearns@adobe.com> wrote: >> Correction: WebKit displays the content in one of the subsequent >>columns, >> and Gecko and Opera display the content below the multicolumn element. I >> have too many windows open, sorry for the error. The Gecko and Opera >> multicol behavior makes sense to me, and I don't understand the WebKit >> behavior. > >Ah, kk, now I get it. Yes, I agree, go with the Gecko/Opera behavior. > >Our behavior is crazy. I think we just literally slice the renderer >and restart it in the next column, which is why sometimes you'll get >an element at the end of one column, and it's bottom border and shadow >at the start of the next. > >~TJ I think there's lots of craziness to spread around, in part because there isn't a spec that says what should happen. The test below renders differently in FF, IE, Chrome/Safari and Opera. Some of the differences look like bugs to me, but part of the problem is differing interpretations of underspecified interactions. I'll start a separate thread with some text I think should be added to css3-break, as this isn't an issue limited to regions and isn't strictly about overflow. Thanks, Alan <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Argh</title> <style> .spacer { height: 100px; } .multicol { -webkit-column-count: 2; -moz-column-count: 2; -ms-column-count: 2; column-count: 2; height: 3em; background-color: lightyellow; } .rel { position: relative; top: 3em; } .top-of-col { font-size: 36px; line-height: 12px; } </style> </head> <body> <div class="spacer"></div> <div class="multicol"> <div class="top-of-col">One</div> <div class="rel">Two</div> <div class="top-of-col">Three</div> <div>Four</div> </div> </body> </html>
Received on Thursday, 13 September 2012 21:50:48 UTC