JSFiddle - React, Tailwind, and code Playground

by josekerekes

HTML

<div id="container">
    <div class="inner">
        <div class="box">
    <h1>Hello everybody!</h1>
    <p>How are you?</p>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin tempor elementum dui, et consectetur dolor vestibulum vel. Vivamus mi dui, sodales nec dignissim et, porttitor a tortor. Nulla nec ultricies dui. Interdum et malesuada fames ac ante ipsum primis in faucibus. Suspendisse nec massa nec elit blandit aliquet eu vestibulum neque. Maecenas vel neque blandit, viverra sem nec, convallis dolor. Sed sed neque purus. Fusce feugiat commodo eros, vel ultrices nisi. Donec non urna mauris. In eleifend lobortis nisi a placerat. Nullam sit amet semper mauris. Sed sed massa non ligula rutrum maximus faucibus a arcu. Fusce tincidunt libero in mauris pellentesque elementum. Phasellus luctus varius mi. Donec vulputate, sapien vitae euismod efficitur, orci ligula convallis ligula, sit amet elementum ante turpis nec elit. Curabitur scelerisque dui ac tempor imperdiet.</p>
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin tempor elementum dui, et consectetur dolor vestibulum vel. Vivamus mi dui, sodales nec dignissim et, porttitor a tortor. Nulla nec ultricies dui. Interdum et malesuada fames ac ante ipsum primis in faucibus. Suspendisse nec massa nec elit blandit aliquet eu vestibulum neque. Maecenas vel neque blandit, viverra sem nec, convallis dolor. Sed sed neque purus. Fusce feugiat commodo eros, vel ultrices nisi. Donec non urna mauris. In eleifend lobortis nisi a placerat. Nullam sit amet semper mauris. Sed sed massa non ligula rutrum maximus faucibus a arcu. Fusce tincidunt libero in mauris pellentesque elementum. Phasellus luctus varius mi. Donec vulputate, sapien vitae euis>/p>
          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin tempor elementum dui, et consectetur dolor vestibulum vel. Vivamus mi dui, sodales nec dignissim et, porttitor a tortor. Nulla nec ultricies dui. Interdum et...

CSS

body {
    background:url(http://thecsscoder.com/blog/blog-images/landscape.jpg) no-repeat 0 0;
    padding:100px 50px;
    margin:0;
    background-attachment:fixed;
    /*this row is only for illustration purposes, you can exclude it*/ overflow:scroll; 
}
#container { 
    width:540px;
    height:1700px;  
   
    
    clip-path: url(#clipped1);
}
#container .inner {
    border:1px solid red;    
    width:540px;
    color:#fff; 
    position:fixed   
}
#container .inner .box { 
    background:url(http://thecsscoder.com/blog/blog-images/dog.jpg) no-repeat 0 0;  
    padding:50px;
    overflow:scroll;
    height:300px;
        
}