Cell bkgrnd color not working in v3.1

  • Resolved kpferde

    (@kpferde)


    1 month ago

    This CSS was working up to the new update:
    this at the top:
    .tablepress {
    –head-text-color: #ffffff;
    –head-bg-color: #3399cc;
    –head-font-weight: 200;
    –head-line-height: 1.3em;
    font-size: .85em;
    }

    –> and using this for the individual row background color i use only for the titles.

    .tablepress-id-15 .row-2 td {
    background-color: #3399cc;
    font-family: Arial-narrow, sans-serif;
    line-height: 1.2em;
    vertical-align: baseline;
    color: #FFF;
    }

    .tablepress-id-15 .row-4 td {
    background-color: #3399cc;
    font-family: Arial-narrow, sans-serif;
    line-height: 1.2em;
    vertical-align: baseline;
    color: #FFF;
    }
    saw your response for ‘thead th’ inquiry and dumped the server cache, as well.
    but this is for just the individual ‘td’ backgrounds
    — i have an a client in need of titles so i may have move on this and see if i can put code in the table cells to work around this.

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

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Author Tobias Bäthge

    (@tobiasbg)

    1 month ago

    Hi!

    Thanks for your post and sorry for the trouble!

    Indeed, it looks like one of the changes to the default styling broke the ability to set custom row background colors 🙁

    I think I have already identified the problem and will look into fixing this!

    In the meantime, as a workaround, please try using the !important flag on the row’s background color, i.e. change

    background-color: #3399cc;

    to

    background-color: #3399cc !important;

    Regards,
    Tobias

    boabo

    (@boabo)

    1 month ago

    Hello, found same error in 3.1

    Plugin options > custom css, if you add a background-color to your headers such as

    .tablepress thead th {
    background-color: #000;
    color: #fff;
    }

    … headers without title or text (thus empty) display background-color with some opacity:

    .tablepress > :where(thead, tfoot) > tr > * {
    background-color: var(–head-bg-color);
    color: var(–head-text-color);}

    Thank you

    Note: adding important! added opacity to the full header

    Plugin Author Tobias Bäthge

    (@tobiasbg)

    1 month ago

    Hi @boabo,

    The issue that you describe is a little different: Starting with TablePress 3.1, empty cells in the header row will now use HTML <td> elements, instead of <th>, for improved accessibility.

    Due to that, CSS code with a selector like .tablepress thead th { will not apply to that. This means that these empty cells will get the default background color var(--head-bg-color).

    To solve this, instead of using

    .tablepress thead th {
      background-color: #000;
      color: #fff;
    }

    I recommend using the modern approach from https://tablepress.org/faq/change-background-color-table-head-row/ for this.

    Best wishes,
    Tobias

    boabo

    (@boabo)

    1 month ago

    🙂 updated. Thanks a lot

    Plugin Author Tobias Bäthge

    (@tobiasbg)

    1 month ago

    Hi @boabo,

    no problem, you are very welcome! 🙂 Good to hear that this helped!

    Best wishes,
    Tobias

    P.S.: In case you haven’t, please rate TablePress in the plugin directory. Thanks!

Viewing 5 replies - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.