Responsive table + merged cells. How to do? Any solutions?

Question

JavaScript

Good afternoon. Faced with the need to make an adaptive table, I wrote my own small plugin ( https://codepen.io/Naksik/pen/YEbgda there is dirt here but not the point). Everything is OK, it works, but I can’t defeat the merged cells. Can anyone share their solutions to this problem? How to make a similar adaptive table with the ability to merge cells and display normally.
PS Option with overflow:scroll is not suitable

Answer 1

Good evening.
Get away from html markup with table.
Use regular div with nested divs and apply display:grid to them
Then to combine cells at different sizes use grid-template-areas in media
Here is an example
css-live.ru/articles/zolotaya-rybka-css3-grid-layo. ..