Video yükleniyor...

Video Yüklenemedi

Ana Sayfaya Dön

Responsive HTML table with sticky columns and mobile view created using only CSS and HTML ✨ CodePen link below 👇

385,849 görüntüleme • 2 yıl önce •via X (Twitter)

10 Yorum

Viki ✨ profil fotoğrafı
Viki ✨2 yıl önce

Here's that CodePen link:

Baird profil fotoğrafı
Baird2 yıl önce

On the xs scale make each row collapsing. Should just show checkbox and name of user. Then it should have an expandable button to see other column data. That’s my preference.

Viki ✨ profil fotoğrafı
Viki ✨2 yıl önce

It's a good idea, thank you 😊

Rob DiMarzo profil fotoğrafı
Rob DiMarzo2 yıl önce

Incredible work! The container table (max-width: 400px) { td::before { content: attr(data-label); } } is an excellent touch 👏

Daniel Cranney 🇬🇧 profil fotoğrafı
Daniel Cranney 🇬🇧2 yıl önce

Great work on making a tricky task easy 🙌 tables can be so awkward so this is brilliant!

vitaly profil fotoğrafı
vitaly2 yıl önce

Responsive tables are always a pain for a developer. So I like this solution, maybe the headache will be less. You should make a CSS library for tables like this

Code With Mercy profil fotoğrafı
Code With Mercy2 yıl önce

This is beautiful 🤩 love it 😍

Emmanuel uzoezie profil fotoğrafı
Emmanuel uzoezie2 yıl önce

Fantastic build 👏

ByeWind profil fotoğrafı
ByeWind2 yıl önce

This is great, but it must be a lot of code, right?

Viki ✨ profil fotoğrafı
Viki ✨2 yıl önce

No, about 20 additional lines of CSS

Benzer Videolar