JSFiddle - React, Tailwind, and code Playground

by Lalji Tadhani

HTML

<script src="https://code.jquery.com/jquery-3.4.1.slim.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.css">
<h1>
Test
</h1>

CSS

@media only screen and (min-width: 600px) {
    h1{
        margin-top: 15%;
        font-size: 3.5rem;
        color: red;
    }}

@media only screen and (min-width: 768px) {
    h1{
        margin-top: 15%;
        font-size: 3.5rem;
        color: blue;
    }}