Gutenberg: Audio control not visible on the frontend.

[paaljoachim]

It is in relation to this issue at the Gutenberg repository: https://github.com/WordPress/gutenberg/issues/11447

I just tested Twenty Seventeen and notice the audio controls showing up there. It is not showing up in the Beans child theme I am using.

[christophherr]

Looks like we need to add an explicit height to audio maybe something like

.wp-block-audio audio {
     height: 50px;
}

And if you want it centered,

.wp-block-audio {
    text-align: center;
}

[paaljoachim]

I am testing it out. Adding the height makes the player visible.

I also noticed doing an inspect element that this css is already in place: audio, canvas, img, svg, video { max-width: 100%; height: auto; box-sizing: border-box; }

Perhaps we need to add a min-height: 50px; to the original Beans CSS code located here:

---

I also added the

.wp-block-audio {
    text-align: center;
}

It now looks like this: