css format is like this
@media screen and (min-width:1080px) {
.outer{
width:1208px;
height:302px;
border:solid 5px red;
margin:0 auto;
}
.inner{
width:300px;
height:300px;
border:dashed 1px blue;
float:left;
text-align:center;
line-height:300px;
font-size:40px;
}
@media screen and (max-width:1080px) {
.outer{
width:100%;
min-width:404px;
height:604px;
border:solid 5px red;
margin:0 auto;
}
.inner{
width:49.5%;
height:300px;
border:dashed 1px blue;
float:left;
min-width:i200px;
text-align:center;
line-height:300px;
font-size:30px;
}
}
html content
<div class="outer">
<div class="inner">1</div>
<div class="inner">2</div>
<div class="inner">3</div>
<div class="inner">4</div>
</div>
display
on mobile phone
:5
:1280x720