Announcement

**Matt Zimmermann** · 03-13-17, 10:54 AM

Hi Kathleen,

This code should accomplish what you are looking for. Add the CSS to your style.css file.

HTML Code:

<!-- Promo box starts -->
<div class="promo">
    <div class="container">
        <div class="row">
            <div class="col-md-6 col-sm-6">
                <div class="pbox image">
                    <div class="pbox-title">PROMO TITLE 1</div>
                    <div>
                        <mvt:item name="readytheme" param="image( 'promo_1' )"/>
                    </div>
                    <div class="clearfix"></div>
                </div>
            </div>
            <div class="col-md-6 col-sm-6">
                <div class="pbox image">
                    <div class="pbox-title">PROMO TITLE 2</div>
                    <div>
                        <mvt:item name="readytheme" param="image( 'promo_2' )"/>
                    </div>
                    <div class="clearfix"></div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- Promo box ends -->

Code:

.promo .pbox {
    position: relative;
}

    .promo .pbox-title {
        position: absolute;
        left: 50%;
        top: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        text-align: center;
        z-index: 5;
    }

**Miss Kate** · 03-13-17, 07:00 PM

Matt, thank you so much! This was exactly the kind of help I needed.

Announcement

Need some coding assistance in Ready Theme

Need some coding assistance in Ready Theme

Comment

Comment