.adjust-me-based-on-size{
margin-left: 15%;
margin-right: 15%;
}
@media only screen and (min-width: 800) and (max-width: 1200) {
.adjust-me-based-on-size {
margin-left: 10%;
margin-right: 10%;
}
}
@media only screen and (max-width: 800px) {
.adjust-me-based-on-size {
margin-left: 5%;
margin-right: 0%;
}
}
Run code snippet
@media screen and (min-width: 1400px) {
.container {
width: 1370px;
}
}
@media screen and (min-width: 1600px) {
.container {
width: 1570px;
}
}
@media screen and (min-width: 1900px) {
.container {
width: 1870px;
}
}
<meta name="viewport" content="width=device-width, initial-scale=1" />