Making Tables Responsive with Minimal CSS
There are other approaches which avoid the repetition of column names in SPAN chunks as suggested in the article.The most elegant and least bandwidth consuming one is described in https://css-tricks.com/responsive-data-tables/ and uses modern CSS selectors:   td:nth-of-type(1):before { content: "Type of Food"; }
   td:nth-of-type(2):before { content: "Calories"; }
   td:nth-of-type(3):before { content: "Tasty Factor"; }
   ...