In today’s lesson, I’m going to show you how to make a Divi slider image alternate sides. Now before we get into it, all my tutorial ideas come from my own stumbling blocks. And so, before I try to solve my issues, I’ll do a quick Google search to see if my solution already exists. If it does, I’ll try the solution to see if it works then attempt to refine it if possible. And so this tutorial is dedicated to that end. My approach is a simpler way to make a Divi slider image alternate sides with just 2 lines of CSS code. So without further ado lets get started!

Divi ships with almost every styling option control you can think of with very little limitations on what you can’t control. However, it is impossible for them to include every possible option and thus paved the way for hundreds of Divi hacks and/or third party plugins. One of these limitation is the option to control the placement of the image on Divi’s slider module. At its default, the slider image is placed left and the content & button placed right. Now what if you wanted to make the slider more dynamic by alternating the placement of the image on each slide?

First create your slide as you usually would. Now duplicate it and exchange the content.

Now all we have to do is add 2 CSS Rules within the slider you want to reverse. So open the slide and click on the Advanced tab. Locate the “Slide Description” and “Slide Image” and add the following CSS code.