JSFiddle - React, Tailwind, and code Playground

by brandondurham

HTML

<div class="css">
  Hello.
</div>

CSS

.css {
  bottom: 0;
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
}

@media
    (-webkit-min-device-pixel-ratio: 2) and
    (min-resolution: 324dpi) {
    .css {
        background-color: purple;
    }
}

@media
    (-webkit-min-device-pixel-ratio: 2) and
    (min-resolution: 263dpi) {
    .css {
        background-color: green;
    }
}

@media
    (-webkit-min-device-pixel-ratio: 2) and
    (min-resolution: 192dpi) {
    .css {
        background-color: purple;
    }
}