How to make responsive table?

How to make responsive table, as shown on the picture?
Thank you

td {
 min-width: 320px;
max-width: 414px;
March 19th 20 at 08:25
2 answers
March 19th 20 at 08:27
The table does not do adaptive. If you want to content under all conditions was displayed as the top picture, I usually deduce horizontal scrolling.
March 19th 20 at 08:29
To make content in 2 columns do not have to use a table.
All you need to do the flex unit.
<div class="flex_block">
 the <div>Column 1</div>
 the <div>Column 2</div>

.flex_block {
 width: 100%;
 display: flex;
.flex_block > div {
 flex: 1 1 auto;

Properties of blocks, such as width, "malleability", the order can be varied. In fact, there's a bunch of possibilities. If you are not familiar with flexbox here help:

Find more questions by tags Adaptive design