JSFiddle - React, Tailwind, and code Playground

HTML

<a href="#" class="ctrl left"></a>
<a href="#" class="ctrl right"></a>
<article>
    <div>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus eget felis eu elit bibendum vehicula in fermentum eros. Maecenas lacinia sapien sit amet lectus vehicula vitae placerat risus aliquet. Maecenas lacus arcu, eleifend non consectetur non, pulvinar eget ante. In ipsum mi, accumsan quis pharetra in, suscipit vitae diam. Curabitur eget suscipit tortor. Donec leo urna, luctus consectetur posuere non, vestibulum vel quam. Mauris nec libero turpis. Aenean quis tellus est, non eleifend nunc. Donec in malesuada metus. Fusce dapibus dapibus metus, non egestas elit faucibus sed. Quisque id est risus. Etiam elementum, ante et pellentesque suscipit, nisi mi lobortis elit, eu dignissim tortor sapien sit amet libero. Maecenas quam sapien, luctus et gravida et, consectetur ac felis. Proin eu tortor vitae purus volutpat consequat. Nam sit amet justo eget justo auctor porttitor a in elit. Morbi dui lectus, vestibulum ac ornare ac, sodales sed sapien.</p>
    
    <img src="http://fastcache.gawkerassets.com/assets/images/9/2011/04/moneysaversplash0409.jpg">

    <p>Quisque et nibh dolor, ut accumsan velit. Pellentesque felis diam, accumsan non commodo nec, accumsan ut lorem. Praesent libero lectus, viverra in fermentum id, ullamcorper scelerisque tellus. Maecenas lacus ipsum, porta sit amet tempor in, fringilla ut libero. Cras vestibulum augue ut tortor vulputate sed imperdiet diam pretium. Sed luctus vulputate risus vitae volutpat. Morbi justo sem, gravida at placerat eget, mollis a justo. Nam mauris tortor, semper et ornare eu, mollis vel eros. Morbi elementum gravida dolor ut bibendum. Curabitur convallis lobortis quam, eu aliquam metus bibendum in. Pellentesque eget tortor vel enim lacinia facilisis. Nunc cursus porttitor mi, eu porttitor metus consequat quis.</p>

    <p>Cras quam purus, gravida ac dignissim vel, tempus ut neque. Suspendisse nibh tellus, fermentum ut...

CSS

p {
 margin: 0 0 15px 0;   
}

.ctrl {
 position: absolute;   
 width: 10%;
 height: 100%;
    display: block;
    z-index: 999;
}

.ctrl.left {
 background: red;   
 left: 0;   
}

.ctrl.right {
 right: 0;
   width: 13%;
 background: blue;   
}

img {
 width: 100%;
 margin: 0 0 15px 0;  
}
body {
 width: 100%;
  overflow: hidden;  
}
article {
    position: absolute;
    width: 77%;
    padding: 0 3% 0 0;
    left: 10%;
}

div {
    -moz-column-count: 2;
    -moz-column-gap: 3%;  
    -webkit-column-count: 2;
    -webkit-column-gap: 3%;
}

JavaScript

// Controllers
$(".ctrl.left").bind("click", function(){
    $("article").animate({left:0},500,"linear"); 
});

$(".ctrl.right").bind("click", function(){
   $("article").animate({right:0},500,"linear"); 
});

// Resize container to proper height
$('div').css({'height':$(this).height()});
$(window).resize(function(){
   $('div').css({'height':$(this).height()}); 
});