JSFiddle - React, Tailwind, and code Playground

HTML

<div id="preview-image-wrapper">
    <ul>
        <li></li>
        <li></li>
        <li></li>
    </ul>
    <img src="http://placehold.it/465x346" />
</div>

CSS

div, img {
  width: 465px;
  height: 346px;
  position: relative;
}

ul { 
    list-style-type: none;
    position: absolute;
    display: block;
    height: 346px;
    width:100%;
    margin:0;
    padding:0;
    z-index:200;
    overflow:hidden;
}
li { 
    height:346px; 
    border-right:1px solid red; 
    width:25%; 
    display:inline-block;
    margin-right: -4px;
}