Skip to content

Instantly share code, notes, and snippets.

@actuosus
Created April 14, 2015 17:13
Show Gist options
  • Save actuosus/b196e0c823df3348c3c8 to your computer and use it in GitHub Desktop.
Save actuosus/b196e0c823df3348c3c8 to your computer and use it in GitHub Desktop.
Chrome scroll bug
<style>
.fixed {
position: fixed;
min-width: 600px;
top: 20px;
bottom: 20px;
right: 20px;
overflow-y: auto;
border: 1px solid gray;
padding: 20px;
}
.fixed:hover {
box-shadow: 0 0 10px 10px rgba(0,0,0,0.5);
}
.filler {
height: 400px;
}
</style>
<div>
<div class="filler"></div>
<div class="filler"></div>
<div class="filler"></div>
<div class="filler"></div>
<div class="filler"></div>
<div class="filler"></div>
<a href="#h1">h1</a>
<a href="#h2">h2</a>
<a href="#h3">h3</a>
<a href="#h4">h4</a>
</div>
<div class="fixed">
<h1 id="h1">Heading 1</h1>
<div class="filler"></div>
<h1 id="h2">Heading 2</h1>
<div class="filler"></div>
<h1 id="h3">Heading 3</h1>
<div class="filler"></div>
<h1 id="h4">Heading 4</h1>
<div class="filler"></div>
<h1 id="h5">Heading 5</h1>
<div class="filler"></div>
<h1 id="h6">Heading 6</h1>
<div class="filler"></div>
<h1 id="h7">Heading 7</h1>
<div class="filler"></div>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment