Created attachment 460708 [details] safari-screenshot Steps to reproduce the problem: 1. go to https://codepen.io/samanthaj/pen/poLjjVE 2. Make the browser window wide and short enough that box "3" fits but box "4" is pushed off the bottom Problem Description: With the browser window wide enough Safari should be putting 2 of each of the 6 boxes in a their own columns since according to the spec the default values of widows and orphans are both 2 See screenshots
Created attachment 460709 [details] chrome-screenshot
It looks like Safari just doesn't have the correct defaults? If I add widows: 2; orphans: 2; it displays the same as Chrome. The spec shows the default values are 2 https://drafts.csswg.org/css-break/#widows-orphans
Created attachment 460838 [details] rendering safari, firefox, chrome Firefox gets the same behavior than Firefox. Chrome stacks the boxes.
<rdar://problem/96924872>
Thanks for the bug report with the tests! default computed values: # orphans safari: auto (See https://bugs.webkit.org/show_bug.cgi?id=219882) firefox: n/a (see https://bugzilla.mozilla.org/show_bug.cgi?id=137367) chrome: 2 # widows safari: auto (see https://bugs.webkit.org/show_bug.cgi?id=219882) firefox: n/a (see https://bugzilla.mozilla.org/show_bug.cgi?id=137367) chrome: 2 Tested in: Safari Technology Preview 16.0 Firefox Nightly 104.0a1 Google Chrome Canary 105.0.5176.0 This is probably a duplicate of https://bugs.webkit.org/show_bug.cgi?id=219882
*** This bug has been marked as a duplicate of bug 219882 ***