JSFiddle - React, Tailwind, and code Playground

by Abdul Ahmad

HTML

<p>
  You can use <abbr title="something">CSS</abbr> (Cascading Style Sheets) to style your
  <abbr>HTML</abbr> (HyperText Markup Language). Using style sheets, you can
  keep your <abbr>CSS</abbr> presentation layer and <abbr>HTML</abbr> content
  layer separate. This is called "separation of concerns."
</p>

<label for="file">File progress:</label>
<progress id="file" max="100" value="20">20%</progress>

<details>
  <summary>Details</summary>
  Something small enough to escape casual notice.
</details>


<dialog open>
  <p>Greetings, one and all!</p>
  <form method="dialog">
    <button>OK</button>
  </form>
</dialog>