How to Create a Responsive HTML Table
Offered By: Kevin Powell via YouTube
Course Description
Overview
Learn how to create a responsive HTML table in this 27-minute tutorial video. Explore techniques for making tables mobile-friendly while maintaining semantic structure and accessibility. Discover CSS styling methods to enhance table appearance, implement simple and robust responsive designs, and utilize grid layouts for improved cell formatting. Follow step-by-step guidance on setting up the table, applying basic and advanced CSS styles, and addressing accessibility concerns for small screen sizes. Gain insights from expert resources and practical examples to master the art of creating flexible, user-friendly HTML tables for various devices and screen sizes.
Syllabus
- Introduction
- Setting up the table
- My main source of info for this
- Basic CSS to get the table looking better
- Very simple responsiveness
- More CSS styles to improve the look
- The easiest way to make it responsive with a table-container
- A more robust solution
- Alternative to data-attributes
- Using grid to improve the layout inside cells a little
- Fixing the accessibility at small screen sizes
Taught by
Kevin Powell
Related Courses
Probabilistic Graphical Models 1: RepresentationStanford University via Coursera Computer Security
Stanford University via Coursera Intro to Computer Science
University of Virginia via Udacity Introduction to Logic
Stanford University via Coursera Internet History, Technology, and Security
University of Michigan via Coursera