Support » Plugin: TablePress » A date column is only 2 chars wide

  • Resolved MJ

    (@prmyapps)



    I have TablePress 1.7 installed on my website. The largest table is at

    100 Best Soccer Movies

    I recently switched from twenty fourteen to the twenty sixteen theme. This table originally had 5 columns, but it was unreadable on an iphone, and on my mac, column 2 (the 4-char year) was only 2 chars wide. I decided to hide columns 4-5.

    But I still have problems in the computer browser. Column 3 resizes to fill the extra space, but column 2 in the browser remains at only 2-chars wide, so that the year shows up on 2 lines in the cell.

    How can I fix this?
    Thank you for tablepress, I enjoy it very much.

    • This topic was modified 2 years, 5 months ago by  MJ.
Viewing 7 replies - 1 through 7 (of 7 total)
  • Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    thanks for your question, and sorry for the trouble.

    This has two causes: For one, you seem to be affected by a bug in the “Horizontal Scrolling” feature. Can you please try again after turning off that checkbox on the “Edit” screen of the table? To then get horizontal scrolling back, you could try the scroll mode of the TablePress Extension from https://tablepress.org/extensions/responsive-tables/, which uses a slightly better technical mechanism.

    The second reason is in the theme, which adds too many word-wraps. To turn that off, please add this to the “Custom CSS” textarea on the “Plugin Options” screen of TablePress:

    .tablepress {
        word-wrap: normal;
    }

    Regards,
    Tobias

    Hi Tobias!
    Thanks for the quick reply. I made both changes to the plugin, but I still have a little problem with the table layout.

    The table still excessively wraps the Title column. I moved the title column from col 3 to col 1 (thanks for making that easy to do in wpadmin!). This improved the text wrapping of the title, but it is still excessive, since the table still allocates a lot of extra width to columns 2 & 3, which only need a few characters. Is there any way to set individual column widths?

    columns 2-3 are too wide

    Your help is very much appreciated. Thank you!
    -mj lee

    Hi Tobias,
    I re-read the TablePress documentation and found that I could use the plugin option to set the width of columns 2 and 3 to 100px and 130px. This looks fine on the computer browser, but it is not very responsive on an iphone, as shown:
    example

    Is this the best I can do? If so, it is ok.

    It is not optimal, but it is functional. I looked at the Responsive Table Extensions, but I do not wish to use flip, scroll, etc.
    Thank you again for your help. Sorry for all the questions!
    -mj lee

    • This reply was modified 2 years, 5 months ago by  MJ.
    • This reply was modified 2 years, 5 months ago by  MJ.
    • This reply was modified 2 years, 5 months ago by  MJ.

    apologize for duplicates, i’m having trouble incorporating this image link in my reply

    iPhone portrait | iPhone landscape | Columns 2-3 width set to 100-130 px |

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    from what I can see, you CSS with the column widths is applied just fine. It’s simply that the used values are rather large for a mobile. Could you use values like 80px? That should create enough space on small screens for the first column.

    Regards,
    Tobias

    Thank you again, Tobias!
    For the 2 narrow columns of year and rating, I ended up changing the titles to <2 chars each: YR and #, and then I could set their widths to 75px. This sufficiently improved the iPhone layout for column 1.

    I had to make the titles shorter, because otherwise in the computer browser with 80px widths, the sorting arrows overlaid the 4-6 char titles.

    It just took a few minutes of testing to figure this out. I’m not sure how to mark this as resolved, but please do so.

    Cheers and thank you again for your excellent support!
    -mj Lee

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    nice find! Yes, this looks like a good solution!

    Best wishes,
    Tobias

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘A date column is only 2 chars wide’ is closed to new replies.