Stack Overflow
Stack Overflow

Questions tagged [fixed-header-tables]

Tables in which the first row (typically holding the column names) is fixed (i.e.: it doesn't scroll).

Tables in which the first row (typically holding the column names) is fixed (i.e.: it doesn't scroll).

142 questions
130
votes
22 answers

Table with fixed header and fixed column on pure css

I need to create a html table (or something similar looking) with a fixed header and a fixed first column. Every solution I've seen so far uses Javascript or jQuery to set scrollTop/scrollLeft, but it doesn't work smoothly on mobile browsers, so…
panfil
  • 1,489
  • 3
  • 13
  • 19
35
votes
5 answers

with fixed and scrollable
I've looked through questions here and articles all over the internet, but haven't found yet solution that would satisfy my requirements. So now in 2017, is there an elegant way to have a
that would: be written in html+css (no js) have…
Dmitry Stril
  • 1,385
  • 4
  • 16
  • 34
8
votes
2 answers

How to freeze the header of the girdview [gridview and column width are not fixed]

I am implementing Gridview freeze header with vertical scroll bar. I tried lot of solutions that has been suggested here. But the issues are, The Gridview is inside a panel ,whose width is not fixed. Its 97% . 2.The columns don't have fixed…
Vani
  • 1,345
  • 4
  • 27
  • 48
7
votes
1 answer

JS dataTables.fixedHeader different width between header and datas

I use the javascript plugin dataTables.fixedHeader and fill the data with ajax. Now I have the problem, that the width of each data-column is dynamically and the header stays on the same static width. Code: HTML:
alexander-fire
  • 1,082
  • 4
  • 27
  • 52
6
votes
1 answer

Sticky row and column header in table

I am trying to design a table that has a sticky thead and also sticky row headers. So, basically, all th elements must be sticky. I have stumbled across the position: sticky css3 attribute that seems to be a great candidate for the job, even though…
Christopher Chiche
  • 15,075
  • 9
  • 59
  • 98
6
votes
1 answer

Fixed table header in Angular Material Design

How to make table sticky header using md-toolbar I have included thead inside md-toolbar for fixed table header, when i scroll the table content the header is not fixed to top. Below is my code and link to codepen…
apps4any
  • 603
  • 1
  • 6
  • 6
5
votes
5 answers

Looking for fixed headers on a window adjustable table

I have tried looking all over the place and couldn't find a good solution to my problem. I am looking to create a table with fixed headers that stay while scrolling the rest of the table. The problem is I also want it to be able to be aligned when…
acmeyer9
  • 315
  • 1
  • 2
  • 13
5
votes
1 answer

DataTable Fixed Header at page bottom (on first page load)

I have a DataTable with FixedHeader option that has the following initialization populated in my $(document).ready function. Both the headerOffset values that are jquery looked-up and hard-coded at 40 have been attempted, with the same results. …
A554551N
  • 145
  • 1
  • 2
  • 10
5
votes
2 answers

DataTables: When scroll bar of tbody is hidden, fixed column gets messed up

I've got a table which includes: first Column is fixed tfoot horizontal scroll bar of tfoot have hidden horizontal scroll bar of tbody. Fiddle: https://jsfiddle.net/jbeteta/6sxh3gbk/12/ $(function() { $('#example').DataTable({ …
Delmonte
  • 411
  • 2
  • 9
  • 33
5
votes
3 answers

Trouble with FixedHeader

UPDATE: I talked to the author of FixedHeader, and it seems that it isn't going to work for me. I think the problem is that my table is inside of a tab, which is causing some problems (see the screenshots in my other update), and he said that the…
Adam Zerner
  • 17,797
  • 15
  • 90
  • 156
4
votes
0 answers

Setting first li element fixed and to have same layout as the none fixed li element

I have found that the first
  • element can be set to position: fixed; so that it does not scroll with other elements link. If I do this, the layout of this element will be broken, namely, the second li will overlap with the first. Not fixed…
    • khashashin
    • 1,058
    • 14
    • 40
    4
    votes
    3 answers

    jQuery: best plugin for table with fixed header

    What's the best jQuery plugin for creating a table with fixed header? It should be crossbrowser compatible. I'm needing this for creating a datagrid widget.
    Fuxi
    • 7,611
    • 25
    • 93
    • 139
    4
    votes
    3 answers

    HTML table with two sticky columns and headers (using only CSS)

    I'm struggling to get two fixed columns and headers using a HTML table + scrollable body. I've searched a lot and found these approaches: this (only 1 fixed column/header) and this (only 1 fixed column/header; no table markup) and I've also created…
    baris1892
    • 981
    • 1
    • 16
    • 29
    4
    votes
    1 answer

    Data tables fixed header in bootstrap modal not working

    Am loading a copy of Data table from the parent page into bootstrap modal and am changing the id for the table in modal first. After this am initializing the data table for both the tables differently. Also making the header fixed with data table…
    user3659134
    • 41
    • 1
    • 3
    4
    votes
    1 answer

    Making a scrollable table with fixed header and fixed sidebar

    I need to always display the header and sidebar indexes, but let the content be scrollable freely x & y ... any solutions to this problem? I have looked at DataTables jQuery plugin (example: link), but I was wondering if there were any alternatives.
    riccardolardi
    • 1,713
    • 5
    • 20
    • 35
    1
    2 3
    …
    9 10