JSFiddle - React, Tailwind, and code Playground

HTML

<html>
    <head>
        <title>test</title>
    </head>
    <body>
  <div id="header">
    MY CONTENTS
  </div>
  <div id="main">
      MY OTHER CONTENTS<br/>
      MY OTHER CONTENTS<br/>
      MY OTHER CONTENTS<br/>
      MY OTHER CONTENTS<br/>
      MY OTHER CONTENTS<br/>
      MY OTHER CONTENTS<br/>
      MY OTHER CONTENTS<br/>
      MY OTHER CONTENTS<br/>
      MY OTHER CONTENTS<br/>
      MY OTHER CONTENTS<br/>
      MY OTHER CONTENTS<br/>
      MY OTHER CONTENTS<br/>
      MY OTHER CONTENTS<br/>
      MY OTHER CONTENTS<br/>
      MY OTHER CONTENTS<br/>
      MY OTHER CONTENTS<br/>
      MY OTHER CONTENTS<br/>
      MY OTHER CONTENTS<br/>
      MY OTHER CONTENTS<br/>
      MY OTHER CONTENTS<br/>
      MY OTHER CONTENTS<br/>
      MY OTHER CONTENTS<br/>
      MY OTHER CONTENTS<br/>
      MY OTHER CONTENTS<br/>
      MY OTHER CONTENTS
  </div>
</body>
</html>

CSS

#header {
    position: fixed;
    top: 0px;
    left: 0px;
    background: #0F0;
    width: 100%;
    height: 100px;
}
#main {
    margin-top: 100px;
    background: #00F;
}