<div class="wrap">
  <div class='border1 child'></div>
  <div class='border2 child'></div>
</div>

.wrap {
  display: flex;
  justify-content: center;
  margin: 40px auto 0;
}
.child {
  display: inline-block;
  width: 200px;
  height: 200px;
  border-width: 10px;
  border-color: #e3e3e3;
}
.border1 {
  border-style: solid double dotted dashed;
  margin-right: 20px;
}
.border2 {
  border-style: groove ridge inset outset;
}