Forum Replies Created
-
Posts
-
Hello back everyone, I’ve managed to solve it by my own after many tests.
Here I share the code, hope it helps someone else:
.scrollable-tab .av-layout-tab-inner .container { position: relative; overflow: auto!important; max-height: 600px!important; } /* Styles for WebKit (Chrome, Safari) */ .scrollable-tab .av-layout-tab-inner .container::-webkit-scrollbar { width: 15px; } .scrollable-tab .av-layout-tab-inner .container::-webkit-scrollbar-track { background: #f1f1f1; } .scrollable-tab .av-layout-tab-inner .container::-webkit-scrollbar-thumb { background-color: #FF9D26; border-radius: 2px; border: 2px solid #f1f1f1; } .scrollable-tab .av-layout-tab-inner .container::-webkit-scrollbar-thumb:hover { background-color: #FFB84D; }If you have any ideas to improve it, please comment.
Regards,
I would like to copy the same style as those in the example. Which means a proper shadow behind the table. For that I think I must reduce the % of the table but I don’t know where exactly.
Also the header should have rounded borders, and the table should have different color every each line to make it more readable.
And is there a chance to delete the lines that divide the columns?In short, reproduce what’s on the example, but in my own table, that it’s into a scrollable div, itself into a tab subpage.
I can make a jpg with a clear example of what I aim to, if needed.
I just made some tests and as expected it doesn’t work. How can I share some link in private with you?
Regards,
I see you around for years in this forum. Your contribution is awesome! Thank you very much! I’m going now to try with your code.
On your first example, there is a little “box” on the top of the scroll section. From my tests, if you set custom width for columns, that little box turns funny and take a totally random shape and size. Perhaps I did something wrong…
I’m looking to get exactly the same result as the examples I sent in here: https://colorlib.com/etc/tb/Table_Fixed_Header/index.html
But perhaps this is impossible without changing the way Enfold generates tables. From what I know, it takes a custom class at some section that enfold doesn’t automatically generates. And it’s way too hard for me to figure out how to solve that trough JS.Thank you again, will make some new tests based on your page.
Regards,Dear Staff and members, thank you for the further explanations. I’ve managed to make my tables sortable by adding “sortable” class.
However, I’ve been dying for weeks trying to make each table self scrollable. For some reason, the header turns funny, or the body don’t match, or others weird things happens.
Please, refer to this link, first or 2nd tables is what I would like to reach. https://colorlib.com/etc/tb/Table_Fixed_Header/index.html
Any way to get such result? I’ve been trying many ways, but could never get into it, even with chatGPT supporting me.
Let’s take a table class named “fancy-table” + “sortable” as example. With 4 columns and each with custom width in %. Let’s say: 10% 20% 20% 50%.
Thank you in advance to anyone being able to solve this. Would be a huge help for me but probably for others. And perhaps a feature for future enfold versions. At least on documentation
