6.1.1 #permalink .teaser_insert

Toggle example guides Toggle HTML markup

This is a teaser enhancement, which allows to render a category or flag into the head part of a teaser which layers above the contents. You may also use it to create caption text elements inside the teaser, just add the caption class to it. To make the insert span the whole width, add a col--12 class (or whichever fits your needs)

Examples
Default styling
A flag or caption
Content goes into here
.teaser_insert--topl
Places the label into the left upper corner (default)
A flag or caption
Content goes into here
.teaser_insert--topr
Places the label into the right upper corner
A flag or caption
Content goes into here
.teaser_insert--bottoml
Places the label into the left lower corner
A flag or caption
Content goes into here
.teaser_insert--bottomr
Places the label into the right lower corner
A flag or caption
Content goes into here
Markup 
<div class="teaser">
    <div class="teaser_head cols--1000-6">
        <span class="teaser_insert {modifiers}">
            A flag or caption
        </span>
        <img src="https://unsplash.it/g/800/450" alt="">
    </div>
    <div class="teaser_body cols--1000-6">
        Content goes into here
    </div>
</div>
Source: teaser/css/teaser.css, line 62