Get flexbox to behave as a table - html

Question

I'm trying to make a table with flexbox but, I have some problems getting it to behave like a table. I can not get it to take only the space required, but still be aligned vertically. As you can see if you run the attached code all column's are taking up the same space. Any suggestions for how I can fix this?
.table {
display: flex;
flex-flow: column;
border-top: 1px solid #000;
border-left: 1px solid #000;
max-width: 100%;
}
.table__row {
display: flex;
max-width: 100%;
border-bottom: 1px solid #000;
}
.table__row:nth-of-type(even) {
background-color: #fff;
}
.table__row:nth-of-type(odd) {
background-color: #efefef;
}
.table__column {
display: flex;
text-align: left;
flex-grow: 1;
flex-basis: 0;
padding: 0 1rem;
border-right: 1px solid #000;
word-break: break-word;
}
.table__header {
background-color: blue;
color: #fff;
}
<div class="table">
<div class="table__row">
<div class="table__column table__header">
ID
</div>
<div class="table__column table__header">
TAG
</div>
<div class="table__column table__header">
USED
</div>
<div class="table__column table__header">
USER
</div>
<div class="table__column table__header">
IP
</div>
<div class="table__column table__header">
DATE
</div>
</div>
<div class="table__row">
<div class="table__column">
1
</div>
<div class="table__column">
newpage
</div>
<div class="table__column">
0
</div>
<div class="table__column">
1
</div>
<div class="table__column">
0
</div>
<div class="table__column">
05.02.2018
</div>
</div>
<div class="table__row">
<div class="table__column">
2
</div>
<div class="table__column">
news
</div>
<div class="table__column">
0
</div>
<div class="table__column">
1
</div>
<div class="table__column">
0
</div>
<div class="table__column">
05.02.2018
</div>
</div>
<div class="table__row">
<div class="table__column">
3
</div>
<div class="table__column">
rajohan
</div>
<div class="table__column">
0
</div>
<div class="table__column">
1
</div>
<div class="table__column">
0
</div>
<div class="table__column">
05.02.2018
</div>
</div>
<div class="table__row">
<div class="table__column">
4
</div>
<div class="table__column">
website
</div>
<div class="table__column">
0
</div>
<div class="table__column">
1
</div>
<div class="table__column">
0
</div>
<div class="table__column">
05.02.2018
</div>
</div>
<div class="table__row">
<div class="table__column">
5
</div>
<div class="table__column">
testtesttesttesttest test test
</div>
<div class="table__column">
0
</div>
<div class="table__column">
1
</div>
<div class="table__column">
0
</div>
<div class="table__column">
05.02.2018
</div>
</div>
</div>