Search
32 results 1-10
Examples
Forum
- 15th Jul 2025TailwindI've been using Tailwind for a little while now and really prefer it. I've used most frameworks (Bootstrap, Foundation and Bulma) but Tailwind is smartly designed and would like to see a Datatables implementation.
- 7th May 2025Integration of tailwind cssDataTables core integration with Tailwind, I'm not currently working
- 5th Aug 2024Problem with Tailwind.Hey everyone, We have recently built a Tailwind version of the datatables plugin with Flowbite. Includes all major features like searching, filtering, sorting, pagination, and more. Cheers!
- 5th Jun 2024How to deal with tailwind css?Link to test case: https://live.datatables.net/fizuwupi/12/edit Debugger code (debug.datatables.net): irixub Description of problem: I am using tailwind css, I do not know why the column Name overlap with column External ID
- 9th Apr 2024Tailwind integration for FixedColumns with hover/stripe styles for light/dark modesproblem: I have integrated Tailwind for FixedColumns with hover
- 24th Jan 2022Tailwind CSSHas anyone successfully used Datatables in combination with Tailwind CSS? or seen that anywhere?
- 2nd Dec 2020Tailwind CSS SupportPlease, is there support for Tailwind CSS styling?
- 12th Nov 2024Vue component with TailwindDescription of problem: I have created a datatable with a custom "action" column. In that manual "action" slot, I create a button that when clicked, shows a div. This is my DataTable code: <DataTable ref="table" :columns="columns" :data="data" :options="options" class="display"> <template #action="props"> <button id="dropdownMenuIconButton" data-dropdown-toggle="dropdownDots" type="button">Click me</button> <div id="dropdownDots" class="z-10 hidden bg-white">Works</div> </template> </DataTable> When I click on the rendered button, nothing happens. To make sure that the "click me" button works without the DataTable, I moved the code (button and div) outside of the DataTable declaration. When I click the "click me" button, the div shows.... so I know the functionality works outside the Datatable. Any thoughts on how I can carry this functionality to the cell of the Datatable? Thanks. Note: the "Click Me" button is rendered using Flowbite (https://flowbite.com/docs/components/buttons/)
- 17th Oct 2024Header misalign using Tailwind CSS (Tech. preview) with scrollX: trueHi Allan, Thank you for the update. I add the query string and your test case looks good to me in Chrome and Firefox: https://live.datatables.net/bilecufu/1/edit?html,js,output I also test it with FixedColumn for this thread: https://live.datatables.net/yaroyala/57/edit?html,js,output It looks good for the first page, after going to page 2, page 3, the misalignment issue still occurs. Sometimes the header is shorter, sometimes wider than the table cell. I further tested it without FixedColumn to just check for pagination: https://live.datatables.net/gakuzisi/1/edit?html,js,output My observation is that when the table is not horizontally scrollable, it looks fine when changing the pages. But as long as horizontal scrollbar shows, tiny misalignment shows. But it is less obvious than using FixedColumn. So, in general, the misalignment issue now only occurs when pagination with a horizontal scroll bar is present. If there is no pagination, everything is fine regardless of whether there is a horizontal scroll bar or not.
- 9th Oct 2025Future and support for the extension "ScrollResize"but it's not got Tailwind installed as with my