flex box table fixed thead

gistfile1.txt

body {
  background :#fffeb3;
/*  display: flex;
  justify-content: center;
  align-items: center;*/
}

img {
  width: 100%;
  max-width: 500px;
}

.wrap {
  
}
thead {
  background: #f1f1f1;
 
}

.table--fixed th,
.table--fixed td {
  padding: 3vh;  
}

.table--fixed thead th {
  background-color:#333;
  color:white;
}

.table--fixed tbody tr:nth-child(odd){
  background-color:#DDD;
}


/*Flexbox logic */

.table--fixed {
  display: flex;
  width: 100%;
  flex-flow: column;
}

.table--fixed thead {
  display: block;
  } 
  
.table--fixed thead tr {
    display: flex;
  } 
  
.table--fixed thead tr th {
      flex: 1;      
  }
    
.table--fixed thead tr th:nth-child(2) {
      flex: 0 0 20px;
  }
  


.table--fixed tbody { 
  height: 500px;
  overflow-y: auto;
  width: 100%;
}
.table--fixed tbody {
  display: block;
  
} 
.table--fixed tbody tr {
    display: flex;
    flex-wrap:nowrap;
}
.table--fixed tbody tr td {
  flex: 1;
      /* display:flex;
       justify-content:flex-start;*/
}
.table--fixed tbody tr  td:nth-child(2){
  flex: 0 0 26px;
}