- 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