Carousel: Text

<div id="example-text" class="splide">
    <div class="splide__slider">
        <!-- relative -->
        <div class="splide__track">
            <ul class="splide__list">
                <li class="splide__slide">
                    <h3>Title One Example</h3>
                    <p>Carousels dont have to be images, they can be words. There is no limit to how many words you an use. It is reccommended that you try to match the amount of content in each slide.</p>
                </li>
                <li class="splide__slide">
                    <div class="ribbon">Ribbon Title Two Example</div>
                    <p>Carousels dont have to be images, they can be words. There is no limit to how many words you an use. It is reccommended that you try to match the amount of content in each slide.</p>
                </li>
                <li class="splide__slide">
                    <h2 class="ribbon">Ribbon Title Three Example</h2>
                    <p>Carousels dont have to be images, they can be words. There is no limit to how many words you an use. It is reccommended that you try to match the amount of content in each slide.</p>
                </li>
            </ul>
        </div>
    </div>
</div>

<script>
    new Splide("#example-text").mount();
</script>