JSFiddle - React, Tailwind, and code Playground

by SpiceLab

HTML

<main>
  <header>
    <h1>headline</h1>
    <h2>subline</h2>
    <span>_________</span>
  </header>
  <article>
      <p>Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext
          Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext
          Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext
          Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext
          Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext
          Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext
          Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext
          Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext
          Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext
          Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext
          Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext
          Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext
          Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext
          Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext
          Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext
          Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext Texttexttext
          Texttexttext Texttexttext Texttexttext Texttexttext...

CSS

main {
    border: 1px solid #f11;
    width: 440px;
    height: 450px;
    padding: 25px;
    overflow: hidden;
}
article {
    border: 1px solid #ff1;
    width: 450px;
    height: 250px;
    overflow: auto;
}
p {
    border: 1px solid #f1f;
    width: 400px;
}
p#issue {
    border-color:#000
}

JavaScript

$(document).ready(function(){
    $("article").scroll(function() {
        $("span#value").text($("article").scrollTop());
    });
});