Essentially what your code is saying is "if it's the screen's size, do this until you reach max-width. Since your smallest value is the screen size, your last media query is overriding all of the previous ones.
If you require such specific handling of the divs, specify the min-width in the handling. e.g.
@media only screen and (max-width:768px) {
div#zarada p {width:100%; font-size: 14px;}
.zaradabox img {display:none;}
}
@media only screen and (min-width:769px) and (max-width:1024px) {
div#zarada p {width:38%; font-size: 14px;}
}
@media only screen and (min-width:1025px) and (max-width:1280px) {
div#zarada p {width:38% }
}
@media only screen and (min-width:1281px) and (max-width:1366px) {
div#zarada p {width:39% }
}
etc. Good luck and let me know how it works!
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…