TablePress Row/Line height override

  • Resolved valerielovelace2020

    (@valerielovelace2020)


    4 years, 4 months ago

    Hi Tobias,

    I’ve tried every possible recommendation for overriding template or other CSS on our site to get the proper spacing for rows and lines of content in each row for our tables.

    You’ll notice (https://www.deathwithdignity.org/state-statutes/) it appears we have double-spaced word-wrapping in these tables. If you look at the same tables on my sandbox site, that’s not the case (https://avant-sandbox.dreamhosters.com/), so I think it must be related either to the template or other code we have on our live site.

    I am not the developer and I am not experienced enough to go poking around in styles and other code on our site.

    What recommendations do you have for forcing line height, row height, word-wrapping, etc? I’ve tried your recommended CSS for td, reducing padding to 0, line-height at 1 (defers to font size), also tried % or px settings. Tried white-space settings.

    NOTHING has worked. Driving me a little batty.

    But I LOVE your table plug-in, though, and it is fantastic otherwise for us.

    PS: I secretly hope you one day publish an extension that will highlight the wildcard search term in each cell, so a user can quikly see why a particular row came up in a wild card search (you can see our tables are pretty full of stuff). If I typed “physician” as a wildcard search term, as an example, I’d love for that word to be highlighted yellow in every resulting cell (like a browser “find” term does ).

    Thanks!

    The page I need help with: [log in to see the link]

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    thanks for your question, and sorry for the trouble.

    In your “Custom CSS”, you have the CSS chunk

    /* Cell font and size, excluding header */
.tablepress tbody td {
	font-family: Tahoma;
	font-size: 12px;
	line-height: 4px;
	padding: 0 !important;
}

    Please change that to

    /* Cell font and size, excluding header */
.tablepress tbody td {
	font-family: Tahoma;
	font-size: 12px;
	line-height: normal;
}

    Regarding the PS: I see what you mean, but at this time, I don’t have specific plans to make an Extension for that, sorry.

    Regards,
    Tobias

    Thread Starter valerielovelace2020

    (@valerielovelace2020)

    Hi Tobias,

    I had already tried before (and just tried again). There’s no change in the line height.

    https://www.deathwithdignity.org/state-statutes/

    This is my complete Custom CSS:

    /* Force width override */
    .tablepress {
    width: 100% !important;
    }

    /* Header and Footer Color Settings */
    .tablepress thead th,
    .tablepress tfoot th {
    background-color: #3d3d3d;
    color: #ffffff;
    }

    /* Header and Footer font and size */
    .tablepress thead th,
    .tablepress tfoot th {
    font-family: Tahoma;
    font-size: 12px;
    font-weight: bold;
    }

    /* Cell font and size, excluding header */
    .tablepress tbody td {
    font-family: Tahoma;
    font-size: 12px;
    line-height: normal;
    }

    /* Alternating rows background colors */
    .tablepress .odd td {
    background-color: #DCDCDC;
    color: #000000;
    }

    .tablepress .odd td :hover {
    background-color: #969696;
    color: #000000;
    }

    .tablepress .even td {
    background-color: #fffaf0;
    color: #000000;
    }

    .tablepress .even td :hover {
    background-color: #fffaf0;
    color: #cccccc;
    }

    /* Column 1 width */
    .tablepress-id-1 .column-1 {
    width: 110px;
    }

    .tablepress-id-2 .column-1 {
    width: 110px;
    }

    /* Column 2 width */
    .tablepress-id-1 .column-2 {
    width: 110px;
    }

    .tablepress-id-2 .column-2 {
    width: 110px;
    }

    /* Column 3 width */
    .tablepress-id-1 .column-3 {
    width: 150px;
    }

    .tablepress-id-2 .column-3 {
    width: 150px;
    }

    /* Column 5 width */
    .tablepress-id-1 .column-5 {
    width: 130px;
    }

    .tablepress-id-2 .column-5 {
    width: 130px;
    }

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    can you please try force-reloading the page (“Shift”+”Ctrl/Cmd”+R) to clear the browser’s page cache?

    For me, the line height is then working. I would recommend to also remove the

    padding: 0;

    to get a bit more decent spacing.

    Regards,
    Tobias

    Thread Starter valerielovelace2020

    (@valerielovelace2020)

    Hi Tobias,

    Tried. That didn’t work. But I solved it! I put my custom CSS for TablePress in my WP theme’s custom CSS space. Worked like a charm!!! I changed padding and font to that of our theme style. At the theme level, it seems to work with any browser.

    Check it out: https://www.deathwithdignity.org/state-statutes/

    Thanks for taking the time with me!!!

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    great! Good to hear that you could make it work!

    Best wishes,
    Tobias

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘TablePress Row/Line height override’ is closed to new replies.