How to Create a Fullwidth 2 Column Image & Text Section in Divi

by | Mar 11, 2018 | Divi Tutorial | 48 comments

In this tutorial, I show you how to create a Fullwidth 2 Column Layout with an Image and Text in Divi. There are numerous ways to do this but I’ve found what I think to be the most straight forward and simple solution. This is also accompanied by a free layout! See below for download.
Here's the CSS:
<!-- [et_pb_line_break_holder] -->/*---------------Vertically Center Column Elements---------------*/<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->.et_pb_equal_columns >.et_pb_column {<!-- [et_pb_line_break_holder] -->margin-top:auto;<!-- [et_pb_line_break_holder] -->margin-bottom:auto;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] -->
This code is what will center the text when you check "Equalize Column Heights" in your row settings. I also recommend saving this for all your Divi sites. Cheers to Pierre Sudarovich for providing this code on a recent thread in my Divi Web Designers FB group 🙂
Links mentioned in the video:

Where to Put your Custom CSS in Divi

Vertically Align Content in Divi

Example site shown in beginning:

Magnfi.com