search

filamentgroup / tablesaw

A group of plugins for responsive tables.
MIT License
5.48k stars 434 forks source link

Number of columns to display in swipe mode is miscalculated #265

Closed Dan-Ashdown closed 7 years ago

Dan-Ashdown commented 7 years ago

Hello,

I've hit an issue where if you have long numbers or words the number of columns tablesaw believes it can show is miscalculated resulting in it thinking it can show too many and therefore resulting in the content overlapping:

create_a_new_fiddle_-_jsfiddle

I've created a JsFiddle to illustrate: https://jsfiddle.net/v9of0aq4/2/

The only JS is tablesaw.js and tablesaw.init.js. The only CSS is tablesaw.css. The HTML is just a simple table.

This only seems to be an issue once you "swiped", i.e. when it's applied "table-layout: fixed;" to the table at which point cell content width goes out the window.

Melviyn commented 7 years ago

same issue, no idea how to fix it ?

CCvinc commented 7 years ago

Why not to use text-overflow: ellipsis; or word-wrap to avoid long numbers/words. No?

Dan-Ashdown commented 7 years ago

Thanks for the response CCvinc, that's not a workable option for us at the moment. Truncating long numbers makes them somewhat meaningless and wrapping them makes it 2 different numbers.

In the above screen shot it would be ideal if Tablesaw only showed 3 columns.

zachleat commented 7 years ago

I did create a local test case with a few new changes in the past week or so and couldn’t reproduce with your markup. There were some calculation changes that went in, so hopefully something improved here.

@Dan-Ashdown-FFT Can you retest with the new dist files?

Dan-Ashdown commented 7 years ago

Thanks @zachleat, I've updated the JS Fiddle to use the latest JS and CSS from the master branch but it has the same issue I'm afraid: https://jsfiddle.net/v9of0aq4/4/

zachleat commented 7 years ago

Hmmmmmm, I still don’t see the issue on your jsfiddle. Do you have any additional info on your local environment? Browser/OS?

Is it possible to record a little screencast of what you’re doing?

Dan-Ashdown commented 7 years ago

I only occurs when you swipe:

feb-10-2017 16-33-46

support_details___tech_support_management

zachleat commented 7 years ago

Woo! There it is. Thanks, investigating.

zachleat commented 7 years ago

Thanks for sticking with me on this one.

Tablesaw actually used table-layout: fixed to preserve the widths of the persistent columns while swiping (those using data-tablesaw-priority="persist). But in this case, it didn’t need table-layout: fixed at all because there were no persistent columns. Look for this fix in (the properly released) beta4.