JSFiddle - React, Tailwind, and code Playground
HTML
<div class="myBox">
<img src="http://www.cozeez.co.uk/offline/images/20110415-140443.jpg" />
</div>
<div id="wrapper">
<div id="middle">
<div id="box">
<img src="http://www.cozeez.co.uk/offline/images/20110415-140443.jpg" />
</div>
</div>
</div>
CSS
.myBox {
display: inline-block;
text-align: left;
border-top: 3px solid #0F0;
border-bottom: 3px solid #0F0;
border-left: 3px solid #000;
border-right: 3px solid #000;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
overflow:hidden
}
#wrapper {
position: absolute;
}
#middle {
border-top: 3px solid #0F0;
border-bottom: 3px solid #0F0;
border-left: 3px solid #000;
border-right: 3px solid #000;
border-radius: 5px;
overflow: hidden;
}