JSFiddle - React, Tailwind, and code Playground

by marco_rensch

HTML

<div class="container" data-type="school">type school</div>
<div class="container" data-type="person">type person</div>

CSS

.container{
  min-height: 100px;
  min-width: 100px;
  border: 1px solid red;
  margin: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: sans-serif;
}

div[data-type="person"]{
  border-color: blue;
}

div[data-type="school"]{
  border-width: 6px;
}