Source code
Revision control
Copy as Markdown
Other Tools
<!DOCTYPE html>
<html>
<head>
<style>
.container {
width: 500px;
}
.flex-container {
display: flex;
}
.flex-item {
width: 300px;
}
.short-item {
width: 100px;
height: 10px;
background-color: magenta;
}
.scroller {
overflow-x: scroll;
white-space: pre;
}
.sibling {
width: 100px;
height: 100px;
border: 4px solid blue;
}
</style>
</head>
<body>
<div class=container>
<div class=flex-container>
<div class=flex-item>
<div class=scroller>PASS if always-on scrollbar does not overlap the blue box below</div>
</div>
<div class=short-item></div>
</div>
<div class=sibling></div>
</div>
</body>
</html>