<div class="box">
  <div class="first-item">
    <h1> 1 </h1>
  </div>
  <div class="second-item">
    <h1> 2</h1>
  </div>
  <div class="third-item">
    <h1> 3</h1>
  </div>
  <div class="fourth-item">
    <h1>4 </h1>
  </div>
</div>

.box{
  display: flex; 

}

.first-item{
  border-style:solid;
  border-width: 1px;
  text-align:center;
 
  background-color: lightblue;
  flex-basis:250px;
}

.second-item{
  border-style:solid;
  border-width: 1px;
  text-align:center;
 
  background-color:teal;
  flex-basis: 350px;
 
}
.third-item{
  border-style:solid;
  border-width: 1px;
  text-align: center;

  background-color: cyan;
  flex-basis: 300px;

}
.fourth-item{
  border-style:solid;
  border-width: 1px;
  text-align: center;

  background-color: aquamarine;
  flex-basis: 400px;
}