margin trial

by grano

HTML

<div class="container1">
  <div class="block1-1"></div>
  <div class="block2-1"></div>
</div>
<div class="container2">
  <!--   <div class="block2-1"></div>
  <div class="block2-2"></div>
   -->
</div>

CSS

.container1 {
  display: flex;
  margin-bottom: 10px;
}

.block1-1 {
  width: 100px;
  height: 100px;
  background-color: red;
  margin-right: 10px;
}

.block2-1 {
  width: 100px;
  height: 100px;
  background-color: green;
  margin-left: 30px;
}

.container2 {
  width: 300px;
  height: 100px;
  background-color: blue;
  margin-top: 30px;
}