To make table-based layouts responsive and mobile-friendly:
Use percentage-based widths instead of fixed widths. Apply media queries to adjust the layout for different screen sizes. Stack content vertically on smaller screens by using media queries and CSS properties like display:block. Ensure touch-friendly design by using larger buttons and adequate spacing.