Description
The spec ( https://drafts.csswg.org/cssom-view-1/#scrolling-area ) says the scrolling area contains the margin-edge of the descendants.
The right-most edge of the element’s right padding edge and the right margin edge of all of the element’s descendants' boxes, excluding boxes that have an ancestor of the element as their containing block.
However, all major browsers seems exclude the last item's right-edge-margin in display: flex; flex-direction: row
box.
https://jsbin.com/bibezaloju/1/edit?html,css,js,output
Chrome | Firefox | IE/Edge | |
---|---|---|---|
inline-block | 140, 100 | 120, 100 | 140, 100 |
block | 100, 140 | 100, 120 | 100, 140 |
flex row | 120, 100 | 120, 100 | 120, 100 |
flex column | 100, 140 | 100, 120 | 100, 120 |
IE, Edge and Firefox also excludes the bottom-edge-margin of the last item in display: flex; flex-direction: column
box. (Firefox also excludes last item margins in non-flex boxes.)
Are these just implementation bugs? Or, if there are any special rule for flexbox, shoud css-om-view-1 refer about it?