divi fullwidth slider image right

Divi – Aligning the fullwidth slider image right

divi fullwidth slider image right
It does seem a little odd that image left and right alignment is not included as a setting in the divi fullwidth slider module. By default when you place an image in fullwidth slider it places left side of the text, what if you want to place the image in right and text on left.

The first thing we need to do is create our module. Add a fullwidth section with a fullwidth slider.
Next, open the Custom CSS tab and give the module a CSS Class. For right alignment use ts-slider-image-right. If you want left alignment image then that is the default setting so you don’t need to do anything.

fullwidth-slider-image-right

Once you are happy with all your settings, duplicate the slide as many times as you need and go into each slide and change the images and text as required, then save & exit.

Now for the CSS, copy and paste the code below into your Child Theme style.css or if you aren’t using a child theme (which you really should be) then paste into the Divi > Theme Options > General > Custom CSS section.

/* fullwidth slider image position to right */
.et_pb_slide_description {
float:left !important;
}
.et_pb_slide_image { right: -100px; }

2 thoughts on “Divi – Aligning the fullwidth slider image right”

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top