OLD | NEW |
---|---|
(Empty) | |
1 <!DOCTYPE html> | |
2 <script src="../../resources/check-layout.js"></script> | |
3 <style> | |
4 #scrollable { | |
5 overflow: scroll; | |
6 background: pink; | |
7 height: 300px; | |
8 width: 300px; | |
9 box-sizing: border-box; | |
10 display: flex; | |
11 padding: 100px; | |
12 } | |
13 #item { | |
14 width: 300px; | |
15 height: 300px; | |
16 background: salmon; | |
17 flex-shrink: 0; | |
18 } | |
19 </style> | |
20 Tests that padding bottom on a flexbox works in the face of overflowing content. | |
21 Padding-right does not work. This matches the Blink/WebKit display:block behavio r. | |
22 Unfortunately, IE and Gecko both lose the padding bottom and the padding right. | |
23 <div id="scrollable" data-expected-scroll-height=500 data-expected-scroll-width= 400> | |
24 <div id="item"></div> | |
25 </div> | |
26 <script> | |
27 checkLayout('#scrollable'); | |
28 </script> | |
OLD | NEW |