Column not collapsing when data overflows

Column not collapsing when data overflows

SgianSgiathSgianSgiath Posts: 15Questions: 3Answers: 0

Link to test case: https://www.jmu.edu/inclusion/30-30/presenters-test.shtml
Debugger code (debug.datatables.net):

DataTables_Table_0

Data source: DOM
Processing mode: Client-side
Draws: 2
Columns: 6
Rows - total: 12
Rows - after search: 12
Display start: 0
Display length: 10
Version check
Check to see if your page is running the latest DataTables software.
LibraryInfoInstalledLatest
DataTablesNew version available1.12.11.13.6
AutoFill-2.6.0
ButtonsNew version available2.2.32.4.2
ColReorder-1.7.0
Editor-2.2.2
FixedColumns-4.3.0
FixedHeader-3.4.0
KeyTable-2.10.0
ResponsiveNew version available2.3.02.5.0
RowGroup-1.4.0
RowReorder-1.4.1
Scroller-2.2.0
SearchBuilderNew version available1.3.41.5.0
SearchPanesNew version available2.0.22.2.0
SelectNew version available1.4.01.7.0
Check for common issues
Run automated tests to check for common and previously reported issues.
15 tests complete. No failures or warnings found!

If you are having problems with your DataTables, please upload a data profile using the Upload option below, and post a support request in DataTables forums, with a link to a page showing the issue so we can help to debug and investigate the issue.
Upload configuration data
Upload your table's configuration and data to allow for further analysis.
It can often greatly assist in debugging a table if we can see the configuration and data in the table. This feature of the debugger will read your local DataTables configuration and upload it to debug.datatables.net for inspection.

Important: The data uploaded to the server can only be viewed by SpryMedia employees will be automatically deleted after two weeks. The data will never be sold or otherwise published. It is used for debugging any issues you are experiencing with DataTables only.
Error messages shown: Just some above about versions. I tried new versions with no effect in the example.
Description of problem: At lower resolutions, the last column at the table doesn't collapse. For example, take a look at the page at resolution 361px wide.

Replies

  • allanallan Posts: 61,605Questions: 1Answers: 10,085 Site admin

    Looks like it is working for me in Firefox Windows:

    That's at 454px wide - the columns are collapsing as there isn't enough horizontal width for them all.

    What browser are you using? Although I'd be suprised if that makes a difference in this case.

    Allan

  • SgianSgiathSgianSgiath Posts: 15Questions: 3Answers: 0

    Chrome and it seems to happen at 420px and below. Take a look at the resolution in 361px wide for example. The columns are supposed to collapse under the green buttons when there isn't enough room.

  • SgianSgiathSgianSgiath Posts: 15Questions: 3Answers: 0

    I can duplicate the problem in Firefox using inspect.

  • allanallan Posts: 61,605Questions: 1Answers: 10,085 Site admin

    Chrome with 361px width:

    What do you see at that width?

    Allan

  • SgianSgiathSgianSgiath Posts: 15Questions: 3Answers: 0
    edited September 2023

    This is Chrome on Mac at 377px. Chrome on Windows works fine.

  • allanallan Posts: 61,605Questions: 1Answers: 10,085 Site admin

    I'll try on a Mac when I get home this evening. It is possible there is something else on the page that is forcing the width. To test that you could make the table display: none and see if the page still scrolls horizontally.

    Allan

  • SgianSgiathSgianSgiath Posts: 15Questions: 3Answers: 0

    Thanks for the suggestion. I set the table to display: none and the page no longer scrolls horizontally (overflows). So, it seems tied to the table.

Sign In or Register to comment.