How to create side by side buttons with the Divi Theme?

By default, the Divi button module is set to a display style of block. We need to target the wrapper element of the button module and set it to inline-block. Here’s how:

Go to Row Settings (the row which contains your buttons) > Column Settings (the column which contains your buttons) > Advanced > CSS ID & Classes > CSS Class and then enter the following class in the field:

.side-by-side

Click on apply (green tick).

Now you need to add the following CSS to either the Theme Customizer, Child Theme, or Page Settings. For the purpose of this tutorial, we are going to use Page Setting:

Go to Page Setting (purple gear icon) > Advanced > Custom CSS. Copy and paste the snippet below there:

.side-by-side .et_pb_button_module_wrapper{
  display: inline-block !important;
}

Click on Apply (green tick).

Now we are going to add some space between the two buttons.

Button one module settings > Design > Spacing > Margin > Right and add 12px.

Click on Apply (green tick).

Save the page and you are done!

For more WordPress tips, tricks, and tutorials visit my site.