Divi Align Module to Bottom

When trying to align content to the bottom of a column, use flex.

  1. Make sure your row has the equalize heights option turned ON.
  2. In the column you wish to align the module to the bottom, add in the custom CSS box:
    display: flex;
    flex-flow: column;
  3. In the module custom CSS box add:
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex-grow: 1;

To align the content to the bottom or top just change the css in step 3 to:
justify-content: flex-start; (for top)
justify-content: flex-end; (for bottom)

Thanks to Hædworm for this tip!

Tags: , , ,

Leave a Reply

Other tags used in my blog:

 (1)  (6)  (1)  (16)  (1)  (1)  (20)  (1)  (17)  (4)  (1)  (1)  (7)  (1)  (4)  (17)  (5)  (2)  (30)  (9)  (1)  (12)  (4)  (1)  (4)  (5)  (9)  (1)  (6)  (1)  (4)  (1)  (1)  (1)  (1)  (3)  (1)  (3)  (4)  (7)  (4)  (3)  (4)  (1)  (1)  (2)  (1)  (7)  (13)  (13)  (2)  (6)  (1)  (3)  (16)  (2)  (3)  (1)  (5)  (1)  (31)  (5)  (7)  (9)