JSFiddle - React, Tailwind, and code Playground

by Dhanck

HTML

<a class="phone-mobile" href="tel:1-800-555-1212">+1 (800) 555-1212</a>
<span class="phone-nonmobile">+1 (800) 555-1212</span>

CSS

/* Change behaviour of footer phone link on MOBILE */
@media screen and (max-width: 750px) {
    .phone-mobile {
        display: inline;
    }
    .phone-nonmobile {
        display: none;
    }
}
/* Change behaviour of footer phone link on NON-MOBILE */
@media screen and (min-width: 750px) {
    .phone-mobile {
        display: none;
    }
    .phone-nonmobile {
        display: inline;
    }
}