Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<div class="box">
  <div class="item">1</div>
  <div class="item">222</div>
  <div class="item">3</div>
</div>
<style>
  .box {
    width: 400px;
    height: 50px;
    display: flex;
    background-color: #eee;
  }
  .item {
    height: 50px;
  }
  .item:nth-child(1) {
    width: 50px;
    background: red;
  }
  .item:nth-child(2) {
    width: 70px;
    flex-basis: auto;
    flex-grow: 2;
    background: grey;
  }
  .item:nth-child(3) {
    width: 50px;
    flex-basis: 100px;
    flex-grow: 1;
    background: yellow;
  }
</style>
Output 300px

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers