Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • August 25, 2022 at 2:11 pm #1362790
    Sandy

    What is the Custom CSS to control the standard WordPress post table styling? These are the style items:

    table header
    font-size: 16px;
    font-weight: bold;
    text position: align left, no full width justification
    font color: #222222
    font: Open Sans, same as theme

    table body
    font-size: 16px;
    text position: align left, no full width justification
    font color: #666666
    font: Open Sans, same as theme

    table rows
    alternating background colors: #e4f1f5 and white
    cell padding: 5px or 2% equal on all sides of cell

    August 25, 2022 at 5:08 pm #1362814
    Rikard

    Hey m,

    Could you post a link to where we can see the actual elements please? If you have a screenshot highlighting the changes you would like to make, then please share that with us as well.

    Best regards,
    Rikard

    August 26, 2022 at 3:48 pm #1362894
    Sandy

    Yes, done.

    August 26, 2022 at 4:42 pm #1362897
    Rikard

    Hi,

    Please try this in Quick CSS:

    .wp-block-table th {
font-size: 16px;
font-weight: bold;
color: #222;
}

.wp-block-table td {
font-size: 16px;
color: #666;
}

.wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
background-color: #e4f1f5;
}

    Best regards,
    Rikard

    August 26, 2022 at 5:39 pm #1362900
    Sandy

    Thank you! This helped with many of the items. Can CSS control these?:

    table header
    text position: align left, no full width justification

    table body
    text position: align left, no full width justification

    table rows
    cell padding: 5px or 2% equal on all sides of cell

    Also, can the column widths be controlled with %’s?

    August 27, 2022 at 10:09 am #1362912
    Rikard

    Hi,

    Thanks for the update. The example page doesn’t seem to exist anymore, could you check please?

    Best regards,
    Rikard

    August 27, 2022 at 2:58 pm #1362933
    Sandy

    It’s there, you have to be signed in to see it. The site has been updated with the new CSS and some table tweaks.

    August 27, 2022 at 7:27 pm #1362953
    Rikard

    Hi,

    Please try this CSS instead:

    .wp-block-table th {
font-size: 16px;
font-weight: bold;
color: #222;
padding: 5px;
}

.wp-block-table td {
font-size: 16px;
color: #666;
text-align: left; 
padding: 5px;
}

.wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
background-color: #e4f1f5;
}

    Best regards,
    Rikard

    September 6, 2022 at 2:27 pm #1364056
    Sandy

    Thank you! This works!

    September 6, 2022 at 2:29 pm #1364058
    Yigit

    Hi,

    We are happy that Rikard could help! Let us know if you have any other questions and enjoy the rest of your day :)

    Best regards,
    Yigit

  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 10 total)
  • The topic ‘Custom CSS to style standard post table’ is closed to new replies.