blob: 52d146bd15ada9b54451c5587c4c7d0d5fb19424 [file] [log] [blame]
<!DOCTYPE html>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script src="../../resources/check-layout-th.js"></script>
#scrollable {
overflow: scroll;
background: pink;
height: 300px;
width: 300px;
box-sizing: border-box;
display: flex;
padding: 100px;
#item {
width: 300px;
height: 300px;
background: salmon;
flex-shrink: 0;
<div id=log></div>
Tests that padding bottom on a flexbox works in the face of overflowing content.
Padding-right does not work. This matches the Blink/WebKit display:block behavior.
Unfortunately, IE and Gecko both lose the padding bottom and the padding right.
<div id="scrollable" data-expected-scroll-height=500 data-expected-scroll-width=400>
<div id="item"></div>