JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<div role="navigation" class="navbar navbar-default navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<a href="/" class="navbar-brand">Website</a>
</div>
</div>
</div>
<div class="container">
<div id="div1" class="anchor">
<div>
Div 1
</div>
<div id="div1-1" class="anchor panel panel-default">
<div class="panel-heading">
Div 1-1
</div>
<div class="panel-body panel-collapse collapse in">
...
</div>
<div class="panel-footer">
...
</div>
</div>
<div id="div1-2" class="anchor panel panel-default">
<div class="panel-heading">
Div 1-2
</div>
<div class="panel-body panel-collapse collapse in">
...
</div>
<div class="panel-footer">
...
</div>
</div>
<div id="div1-3" class="anchor panel panel-default">
<div class="panel-heading">
Div 1-3
</div>
<div class="panel-body panel-collapse collapse in">
...
</div>
<div class="panel-footer">
...
</div>
</div>
</div>
<div id="div2" class="anchor">
<div class="levels-world-heading">
Div 2
</div>
<div id="div2-1" class="anchor panel panel-default">
<div class="panel-heading">
Div 2-1
</div>
<div class="panel-body panel-collapse collapse in">
...
</div>
<div class="panel-footer">
...
</div>
</div>
<div id="div2-2" class="anchor panel panel-default">
<div...
CSS
body {
padding-top: 60px;
}
.anchor:before {
content: ' ';
margin-top: -60px;
height: 60px;
display: block;
visibility: hidden;
}