JSFiddle - React, Tailwind, and code Playground

by Sreeraj Saseendran

HTML

<script src="//cferdinandi.github.io/smooth-scroll/dist/js/smooth-scroll.js"></script>
<h1><a data-scroll href="#hello">Go</a></h1>
<div class="spacer"></div>
<h1 id="hello">Hello!</h1>

CSS

html,
body {
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  /* removing this line allows it to work as expected*/
  overflow-x: hidden;
}

/**
 * Ignore presentational styles...
 */

html,
body {
  background: #2ecc71;
  color: #fff;
  font-family: Helvetica, arial, sans-serif;
}

a {
  color: inherit;
}

.spacer {
  height: 300%;
  width: 100%;
  background: #9b59b6;
}

JavaScript

smoothScroll.init();