JSFiddle - React, Tailwind, and code Playground

HTML

<div>Simple div</div>

CSS

div { border: 2px solid gray }
div:after { content: ": this is not an iPad" }
@media screen and (device-width:768px) and (orientation:portrait),
       screen and (device-width:1009px) and (orientation:landscape) {
    
    div { border-color: green }
    div:after { content: ": this should be visible only with iPad" }
}