Learn how to transform a plain TablePress table into a mobile-friendly head-to-head comparison table.
🔥 [Free Trial] Cloudways Superfast Hosting (what I use): cwdeal.com/tablepress
▸▸ 👨💻 Get the CSS code used in the video
www.buildthatwebsite.com/vide...
┬─┬ TablePress 101 ┬─┬
• TablePress Tutorial: b...
📦 More WordPress CSS Tutorials (playlist)
• Chrome DevTools Crash ...
__________Video Chapters___________
0:00 - What we're building
1:26 - Table Structure
1:42 - How to use COLSPAN
2:21 - Add a CSS class to your table
2:33 - Front-end HTML and tablepress classes
4:02 - Where to put CSS code
4:35 - Main table CSS
7:21 - Styling the table header
8:21 - Add a border between columns
8:55 - equal-width columns
9:50 - make it responsive (mobile-friendly)
12:20 - Writing a media query
13:16 - Design the product header (image and button)
15:32 - Fixed Table Header with position:sticky
16:32 - Faux border with box-shadow (hack)
17:05 - Build that next
#tablepress #tutorial #wordpress
Негізгі бет Тәжірибелік нұсқаулар және стиль Tablepress: Make a 'versus' Comparison Table (with sticky header!)
Пікірлер: 13