Slider info text at bottom of slider

  • Currently when inserting any copy onto a slider it appears at the top of the slider. Is there an option for inserting it at bottom of slider. There is a vertical center option that puts it in the middle but not at the bottom.

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Author simonpedge

    (@simonpedge)

    No, but you could make a plan with some HTML & CSS to use Absolute Positioning.

    So in your slide you will have the following HTML:

    <div class='sa_bottom'>
Text content goes here!
</div>

    And then add the following CSS:

    #SLIDER_ID .owl-item .sa_hover_container {
	position:relative !important;
}
#SLIDER_ID .owl-item .sa_hover_container .sa_bottom {
	position:absolute;
	bottom:0px;
	left:0px;
	width:100%;
	text-align:center;
}

    (NOTE: replace ‘#SLIDER_ID’ with the CSS #id of your slider)

    • This reply was modified 4 years, 7 months ago by simonpedge.
    Thread Starter 3bsstudio

    (@3bsstudio)

    Tried as suggested but the type just doesn’t move – stays at the top.

    Have got this in the slider:
    <div class=’sa_bottom’>
    <h2 style=”text-align: center;”><span style=”color: #ffffff;”>Breast Cancer Paphos</span></h2>
    <h4 style=”text-align: center;”><span style=”color: #ffffff;”>Breast of Friends ?Website Design</span></h4>
    </div>

    and this in additional CSS:

    }
    .slider_3414 .owl-item .sa_hover_container {
    position: relative !important;
    }
    .slider_3414 .owl-item .sa_hover_container .sa_bottom {
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100%;
    text-align: center;
    }

    but just sits at the top?

    Page is here: https://bbqgasbottles.co.uk/test-portfolio/

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Slider info text at bottom of slider’ is closed to new replies.