Background colour of cell

  • Resolved andynz

    (@andynz)


    3 years, 7 months ago

    Hi Tobias
    I know this topic has been discussed a lot, so am not that hopeful – but here goes.
    A table cell is coded as: <div class=”xx-tab-highcell”>Reel</div>
    and my tablepress options include:
    .xx-tab-highcell {color: #0866be;font-weight: bold;padding-left: 10px;padding-right: 10px;border: 2px solid #0866be;background-color: #e6f2ff;}
    This works, as you can see in the link, but the background colour is not applied to the entire cell.
    I realise that I could achieve this by coding the row/column explicitly in the tablepress options, but this may need to be edited when a new row is added (I have used this technique in the third table in the link, where I have set the colour of an entire row).
    Is there any way in which I can format the content of a table cell such that the background colour is applied to the entire cell?
    Andy

    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 post, and sorry for the trouble.

    You could use a little CSS trick here, with negative margins. Plesae try this “Custom CSS” instead of what you have now:

    .xx-tab-highcell {
    color: #0866be;
    font-weight: bold;
    padding: 4px 22px;
    border: 2px solid #0866be;
    background-color: #e6f2ff;
    margin: -6px -24px;
}

    Regards,
    Tobias

    Thread Starter andynz

    (@andynz)

    Thanks, Tobias, that is very helpful.
    I have been experimenting and find that left and right margins of -24px is a big improvement (not so bothered about top and bottom).
    Padding-left of 22px makes sure that the content is lined up with other cells, but have left padding-right unchanged for now (still experimenting).
    Regards
    Andy

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    good to hear that this helped! The CSS I posted does fill the full cell with the blue background and border for me.

    Best wishes,
    Tobias

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

    Thread Starter andynz

    (@andynz)

    Yes, it did for me too.
    Sorry for the confusion, but I have been trying out various options on my test site.
    I will shortly put back the password on my test site, so thanks for your help.

    By the way, I picked up another of your hints while browsing the forum. I wanted to avoid the blank lines between list items and found that this does the trick:
    .tablepress ul br,
    .tablepress ul+br {
    display: none;
    }

    Will now give you a well-deserved 5-star rating.
    Andy

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    yes, that’s also a good approach to hide line breaks. Alternatively, you can add this parameter to the Shortcode:
    [table id=123 convert_line_breaks=false /]
    `
    Best wishes,
    Tobias

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Background colour of cell’ is closed to new replies.