YoVDO

How to Create a Responsive HTML Table

Offered By: Kevin Powell via YouTube

Tags

HTML & CSS Courses Computer Science Courses Web Development Courses HTML Courses Web Accessibility Courses Responsive Web Design Courses

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: Representation
Stanford 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