JSFiddle - React, Tailwind, and code Playground

HTML

<div id="content"><a href="http://www.stackoverflow.com" target="_blank"ta>content goes here</a></div> 

<div class="left column"> 
<div id="leftcol"></div> 
</div> 

<div class="right column"> 
<div id="rightcol"></div> 
</div>

CSS

html, body {
margin: 0;
padding: 0;
}

body {
text-align: center;
} 

#content { 
height: 216px;
margin: 0 auto;
text-align: left;
background:url('http://www.wireframebox.com/test/sideimages/main.jpg');
overflow:auto;
width:960px;
} 

.column { 
width: 50%; 
position: absolute; 
top: 0; 
z-inde:-10;    
} 

.left {left: 0;} 
.right {right: 0;} 

#leftcol {
background:url('http://www.wireframebox.com/test/sideimages/left.jpg') top right no-repeat;
height: 750px;
margin-right:480px;
overflow:hidden;

} 
#rightcol {
margin-left:480px;
background:url('http://www.wireframebox.com/test/sideimages/right.jpg') left top no-repeat;

height: 750px;
overflow:hidden;
}