JSFiddle - React, Tailwind, and code Playground

by Lalji Tadhani

HTML

<select name='test'>
        <option value="volvo">Volvo</option>
        <option value="saab">Saab</option>
        <option value="opel">Opel</option>
        <option value="audi">Audi</option>
      </select>
      <div>
        HI THERE
      </div>
      <input type="checkbox" id="ossm" name="ossm">
      <div class='tester'>
        HELLO
      </div>
      <label for="ossm">CSS is Awesome</label>

CSS

option:checked {
  height: 100px;
  width: 100px;
}

.tester {
  display: none;
}

select[name=test] option[value=volvo]:checked {
  width: 500px;
  background-color: red;
  font-size: 10px;
  display: block;
}
div {
  display: none
}
select[name=test] option[value=volvo] + div {
  display:block;
}
input[type=checkbox]+label {
  color: #ccc;
  font-style: italic;
}

input[type=checkbox]:checked+div {
  color: #f00;
  font-style: normal;
  display: block;
}