Тёмный

Tablepress: Make a 'versus' Comparison Table (with sticky header!) 

Build That Website
Подписаться 4,2 тыс.
Просмотров 5 тыс.
50% 1

Хобби

Опубликовано:

 

5 окт 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 13   
@dvlprsakib9970
@dvlprsakib9970 3 года назад
Very Help full and informative video..
@aidanpilet
@aidanpilet 2 года назад
Very helpful, thank you.
@tmondol1
@tmondol1 Год назад
Great video...like to ask how can I make the first column sticky?
@luisbassols8900
@luisbassols8900 2 года назад
Awesome video but sticky doesn´t work for me either. It is necessary to install the Extension DataTables FixedHeader..? Thank you!
@BuildThatWebsite
@BuildThatWebsite 2 года назад
It seems like it may not work with the Datatables library active. Also, chrome and edge can't stick the thead element, you have to target the elements instead.
@Dispatern
@Dispatern 2 года назад
@@BuildThatWebsite Very helpful video and code! Thank you very much. The sticky header code works for my table press tables in the Opera browser but not in Chrome. :(
@BuildThatWebsite
@BuildThatWebsite 2 года назад
@@Dispatern Which element did you stick with CSS? Position sticky works with TH elements but not Thead or TR elements in chrome.
@Dispatern
@Dispatern 2 года назад
@@BuildThatWebsite Hello! Thank you for the reply. I indeed used it on tr. In the code it's tr.row-1. In my tables the first row works as my table header but I'll try to change that now. Thank you for the tip and have a great weekend! :)
@techbestreview3989
@techbestreview3989 2 года назад
Many thanks #love#
@weiss-shaw
@weiss-shaw 2 месяца назад
I set the parameters exactly as in the video above, but the form doesn't respond at all. I don't know what's going on.
@BuildThatWebsite
@BuildThatWebsite 2 месяца назад
If the CSS is written correctly then the next step is to confirm it's actually being loaded on the page.
@Nilslab
@Nilslab 3 года назад
sticky not work, by the way the video is awesome .tablepress.compare tr.row-2 { position: sticky; top:0; box-shadow: inset 0 -1px #ddd; }
@BuildThatWebsite
@BuildThatWebsite 3 года назад
Hmm, I wonder if it's a browser support issue. Which browser are you using? One thing that can break sticky table rows is the overflow property. Trying setting the element to overflow: auto; and see if that fixes it.
Далее
Using CSS custom properties like this is a waste
16:12
Просмотров 173 тыс.
The secret to mastering CSS layouts
17:11
Просмотров 284 тыс.
Make a WordPress Pricing Table with TablePress
20:20
Просмотров 14 тыс.
Why Beautiful Websites Don’t Convert
12:57
Просмотров 166 тыс.
How to design the perfect Hero Section w/ Elementor
20:29
I redesigned YOUR websites
20:44
Просмотров 30 тыс.
Современные мужчины…
0:37
Просмотров 4,1 млн
Living life on the edge 😳 #wrc
0:17
Просмотров 8 млн