In this video, we'll go through a few iterative steps to improve the way we display table content on smaller devices.
We'll first make the table scroll horizontally to avoid breaking the layout. We'll then hide a few table columns based on the available viewport width.
Then, we'll collapse the content of multiple columns into one single column.
Finally, we'll opt out of using a table for smaller screens, and use a totally different card layout instead.
Enjoying my teaching style? I'm creating an independent Tailwind CSS course called Pro Tailwind. Check it out at protailwind.com ❤️
Chapters
0:00 Intro
0:29 Starting point
1:29 Horizontal scrolling
2:18 Collapsing columns
4:40 Stacking columns
11:52 Alternative layout
13:14 Let's Recap!
Негізгі бет Ойын-сауық Tailwind CSS: Displaying Table Content At Smaller Screen Sizes
Пікірлер: 185