<div class="container">
    <div class="item item-1">1</div>
    <div class="item item-2">2</div>
    <div class="item item-3">3</div>
</div>
html {
  background: #f6faff;
}

/*-- --*/
.container {
    padding: 1rem;
    background-color: darkslategrey;
    display: flex;
    flex-direction: row;
}
.item {
    width: 20rem;
    padding: 2rem 1rem;
    font-size: 2rem;
    line-height: 1;
    text-align: center;  
    background: #e2f0ef;
    border: 3px solid #51aaa3;
    color: #51aaa3;
    margin: 0.375rem; 
}
.item-1 {
   flex-basis: 5rem;
}
.item-2 {
   flex-basis: 10rem;
}
.item-3 {
   flex-basis: 30rem;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js