[Resolved] Change Stripe effect table colour

[chris]

Hi im trying to change the stripe effect on the table where its white and grey, i would like to make the white and grey two different shades of blue, this is the CSS i have been trying to play around with to target the two separate colour rows but cannot find what so ever other than changing the full column to the same colour.

.gb-container.gb-container-4e782949 .wp-block-table table > tbody > tr > td:nth-child(4) {
background-color: orange;
}

I have tried playing with tr > td: etc but struggling as i say to target two classes in one table..

Any idea what i could try next?

[chris]

I have figured out how to do one half of the two colours, with this CSS i have acheved the text and background colour.

Just how would i change the white background that looks like its using the same class?

Im using this:

.wp-block-table.wp-block-table.is-style-stripes {
background-color: #015bd1;
color: white;
}

[chris]

Also how do i delete a row that is empty now? thanks

[David]

Hi there,

which background do you want to change ? perhaps a screenshot will help.

Removing a row in the Block editor – see here:

[chris]

Sure im tying to change the grey boxes on the first coll.

The table is on “Striped” setting and so targering that thrgouh css but need the grey bits to be another shade of blue…

Thanks.

CSS working currently to make half the boxes blue:

.wp-block-table.wp-block-table.is-style-stripes {
background-color: #015bd1;
color: white;
}

[chris]

sorry attached link in private for screenshot of what i mean

[David]

Aah ok so you would use this CSS:

.wp-block-table.is-style-stripes tbody tr:nth-child(2n+1) {
    background-color: #f0f0f0;
}

Change the #f0f0f0 for the color your require

[chris]

Spot on thank you David.

[David]

Glad to be of help

[Author]

Posts