Baskerville 2: Text doesn't show on Cover Blocks

[azollafox]

Steps to replicate

1. Activate Baskerville 2 on your site
2. Add a cover block with a paragraph or header block inside it

Result

In the editor

On the published site

Expected

This is the same content in the theme Twenty Twenty-One

• User report: 3960006-zen

[pauljacobson]

To add to this report, the text is clearly present in the block's HTML, although it's not being rendered on top of the block. Take a look here:

And here:

[pauljacobson]

It also seems that if we add this Custom CSS, it may resolve the issue:

/* Set position for Cover Block inner container to absolute to reveal text on Baskerville */
.wp-block-cover-image .wp-block-cover__inner-container,
.wp-block-cover .wp-block-cover__inner-container {
    position: absolute;
}

[devNigel]

I found out that this happens Cover block is set to align center.

Another workaround is to change the alignment settings for Cover block.

A related issue, but for button links: 4399968-zen

I also shared another CSS work around since the above CSS was affecting the height of the cover block.

/* Fix to make Cover block link buttons clickable  on Baskerville 2 */

.wp-block-cover.has-background-dim:not(.has-background-gradient):before{
  z-index:-1;
}