JSFiddle - React, Tailwind, and code Playground

by Praveen Kumar Purushothaman

HTML

<li>
    <p><strong>Star Rating</strong>  <span>3</span>
    </p>
    <p><strong>Feedback</strong>  <span>asdf</span>
    </p>
    <p><strong>Best</strong>  <span>asdg</span>
    </p>
    <p><strong>Worst</strong>  <span>asdgf</span>
    </p>
    <p><strong>Suggestions</strong>  <span>sdgd</span>
    </p>
    <p><strong>Recommend?</strong>  <span>yes</span>
    </p>
</li>

CSS

* {font-family: Segoe UI; margin: 0; padding: 0; list-style: none;}
body {margin: 15px;}
li p strong, li p span {background-color: #fcf; display: inline-block; width: 125px; border-radius: 3px; margin: 0 0 5px; padding: 5px;}
li p span {width: auto; background-color: transparent; border: 1px solid #fcf; width: 50%;}

JavaScript

$(document)