<div class="parent">
  <div class="child">I have flex-basis: 0</div>
  <div class="child">I have flex-basis: auto</div>
  <div class="child">I have flex-basis: 50%</div>
</div>
.parent {
  display: flex;  
  width: 100%;
  border: thick solid red;
}

.child {
  flex-grow: 0;
  flex-shrink: 0;
  height: 100px;
  border: thick solid blue;
}

.child:first-child {
  flex-basis: 0;
}
.child:nth-child(2) {
  flex-basis: auto;
}

.child:nth-child(3) {
  flex-basis: 50%;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.