1eac2fc088
Only add extra end padding to the scrollable overflow rectangle along axes where content actually overflows the content box. For positive overflow directions, require content to cross the positive content edge so start-side negative overflow does not create a fake scroll range. Add coverage for orthogonal padding, clipped child overflow, and negative start-side overflow that must not make a box scrollable.
30 lines
669 B
HTML
30 lines
669 B
HTML
<!DOCTYPE html>
|
|
<script src="include.js"></script>
|
|
<style>
|
|
#scroller {
|
|
display: flex;
|
|
overflow-x: auto;
|
|
overflow-y: hidden;
|
|
padding-right: 8px;
|
|
width: 200px;
|
|
}
|
|
|
|
#content {
|
|
background: green;
|
|
flex: 0 0 auto;
|
|
height: 20px;
|
|
margin-left: -32px;
|
|
width: 160px;
|
|
}
|
|
</style>
|
|
<div id="scroller">
|
|
<div id="content"></div>
|
|
</div>
|
|
<script>
|
|
test(() => {
|
|
println(`client width: ${scroller.clientWidth}`);
|
|
println(`scroll width: ${scroller.scrollWidth}`);
|
|
scroller.scrollLeft = 100;
|
|
println(`scroll left: ${scroller.scrollLeft}`);
|
|
});
|
|
</script>
|