JSFiddle - React, Tailwind, and code Playground

by willemvb

HTML

<table>
<tr>
    <td class=dots>
        <span class=content>Sample</span>
    </td>
    <td>
        <span class=content>12€</span>
    </td>
</tr>
<tr>
    <td class=dots>
        <span class=content>Another sample</span>
    </td>
    <td>
        <span class=content>120€</span>
    </td>
</tr>
</table>

CSS

table{
  width: 100%; 
  font-family: sans-serif;    
    font-weight: bold;
}
td{
  padding: 0px;
  position: relative;
   width: 50%; 
}


.content{
   background: #fff;  
    padding: 5px;
    display: inline-block;
}

.dots{
     background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAACCAMAAABIdo1RAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo2NEY0N0FGMzBBRjMxMUUyODY3NUY4RTM1QUI3QkFDNSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo2NEY0N0FGNDBBRjMxMUUyODY3NUY4RTM1QUI3QkFDNSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjY0RjQ3QUYxMEFGMzExRTI4Njc1RjhFMzVBQjdCQUM1IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjY0RjQ3QUYyMEFGMzExRTI4Njc1RjhFMzVBQjdCQUM1Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+vh2oXAAAAAZQTFRF////ERERcU8Z2wAAABJJREFUeNpiYGRkYGAAEQABBgAAIgAFjnN1FgAAAABJRU5ErkJggg==) left center repeat-x;    
}