search

contao / contao-demo

This is an example website for Contao, a powerful open source CMS that allows you to create professional websites and scalable web applications.
https://contao.org
Creative Commons Attribution Share Alike 4.0 International
3 stars 8 forks source link

The caption is not visible #48

Open bekanntmacher opened 2 months ago

bekanntmacher commented 2 months ago
Media_elements_-_Contao_Official_Demo
zoglo commented 2 months ago

Maybe something like this:

.content-youtube figure.aspect figcaption,
.content-vimeo figure.aspect figcaption {
    position: absolute;
    /* Because the iframe itself has a border of 2px */
    bottom: 2px; 
    left: 2px;
    right: 2px;

    background: linear-gradient(to top, rgba(0, 0, 0, .7), transparent);
    color: #fff:

    padding: 2px;

    text-align: center;

    /* Same z-index as the iframe */
    z-index: 5;
}

image