<section class="margin-example">
 <div>Box 1</div>
 <div>Box 2</div>
 <div>Box 3</div>
 <div>Box 4</div>
</section>

body {
 /* Reset defaults */
 all: unset;
}

.margin-example {
 display: flex;
 flex-wrap: wrap;
}

.margin-example div {
 width: 200px;
 margin: 0 10px;
 background: rebeccapurple;
 color: white;
}

.margin-example div:first-child,
.margin-example div:last-child {
 margin: 0;
}

@media only screen and (max-width: 425px) {
 /* CSS styles for mobile devices */
 .margin-example div {
  margin: 10px 0;
 }
}