JSFiddle - React, Tailwind, and code Playground

by abarykin

HTML

<div id="content"></div>
<div id="media"></div>

CSS

#media{
background-color:RGBA(0,0,0,0.3);
color:#FF0;
width:200px;
height:20px;
padding:5px;
position:fixed;
top:0;
left:0;
z-index:9999;
}
/* правила для всех устройств */
#content{
padding:5px;
border:none;
}
/* правила для устройств от 320 точек по ширине*/
@media only screen and (min-width: 320px){
  #content{
  padding:10px;
  border:1px solid red;
  }
}
/* правила для устройств от 480 точек по ширине*/
@media only screen and (min-width: 480px){
  #content{
  padding:15px;
  border:1px solid green;
  }
}