Chrome Version: 63.0.3218.0 (Official Build) dev (64-bit)
OS: Ubuntu Linux 17.04

What steps will reproduce the problem?
(1) Visit https://jsfiddle.net/29r6b19o/

What is the expected result?
Four colorful rectangles, each a bit wider than the one above it.

What happens instead?
Only two rectangles show up.  The two lower rectangles (which should be lime and green) are collapsed to 0-width in Chrome.

Please use labels and text to provide additional information.
The missing rectangles are the ones whose border-boxes (padding-right + 2px of border) are too large to fit inside their container.  In all other modern browsers engines*, this is fine and these rects just overflow. But in Chrome, they collapse away to nothing.

BROWSERS I'VE TESTED:
This testcase produces expected results in Safari 10.1, Edge 15, and Firefox 55.
This testcase produces buggy results in Chrome 63, and in older Safari versions -- e.g. Safari 9.1.

(So this may be a legacy WebKit bug which was later fixed in WebKit, after the Blink/WebKit fork.)