1. PROMO Subscribe our All Access Pass @ 75% OFF & access all our 16+ premium Divi extensions: Divi Block Pro, Carousel Toolkit, etc.LEARN MORE
Dismiss Notice
NEW Divi.Help Pro Carousel AI Toolkit - Magically turn your Divi design into carousel, simply by using our online toolkit. No plugins needed. Now it works with Divi 5 as well!Try our carousel AI toolkit
BEST Divi Block - A revolutionary drag & drop tool to easily mix & match 960+ premade blocks (Light & Dark) to kick start your Divi site design. Special module designs are included as well. Also newly added AI generator & color. Now it works with Divi 5 as well!
Learn More About Divi BlockFree Version ~ 340+ Free Blocks

Equalize 3 differents sized blog module column ?

Discussion in 'Free Divi Community Forum' started by Juliendivi, Jan 30, 2022.

  1. Juliendivi

    Juliendivi New Member

    Hi everyone,
    It was a little bit hard for me to make an understanble title so i'll try to explain my probleme clearer.

    I'm curently creating a "newspaper" website using divi and i want it to look clean and beautiful.
    I decided to create a "Latest article" section and to do so, i use the blog module. But instead of using a simple "grid column" with 3 articles displaying, i want to use 3 differents blog module (side by side) to display the articles like i want (using the offset tool).
    Basicaly, i want my middle post to be bigger than the 2 others (on both side) -> see the screens. The problem is the height of the bigger one is different and i can't figure out how to make it equal to the others (or vice versa). I would like them to be all the same height.
    I hope the screens will help you to understand my problem.

    Thank you in advance
    Julien
     

    Attached Files:

    #1 Juliendivi, Jan 30, 2022
    1. PRO MEMBER PERKS Divi.Help Pro Layout Packs - Beautifully crafted Divi layout packs for you to kick start your Divi sites:View Demo
  2. Divi.Help

    Divi.Help Administrator
    Staff Member

    Try to go to the Blog module settings > Advanced > Custom CSS > Featured Image & add:
    Code:
    Log In or Sign Up to view this code.
    Adjust it to fit your need.
     
    #2 Divi.Help, Feb 4, 2022
  3. Juliendivi

    Juliendivi New Member

    Thank you, it worked to keep the "post cards" the same height ! However, the images don't want to stay 150px height when i reduce my frame. Only the big one seems to keep its height, even though i added the code to all the post cards image. See the screens please.
     

    Attached Files:

    #3 Juliendivi, Feb 7, 2022
    1. PRO MEMBER PERKS Divi.Help Pro Layout Packs - Beautifully crafted Divi layout packs for you to kick start your Divi sites:View Demo
  4. Divi.Help

    Divi.Help Administrator
    Staff Member

    Kindly share your URL.
     
    #4 Divi.Help, Feb 19, 2022
  5. Claus Faber

    Claus Faber New Member

    I did this with:
    1) in the row settings, go to "design", select "adjust size" and tick "equalize column height" to "yes" (sorry, I have the German Divi, I don't know the exact English expressions). --> done this way, the columns have all the same height as the highest column.
    2) in every content module (blog post module in your case) add the following custom css:

    height: 100%;

    --> that makes the height of the content module the maximum height of the column. As all columns have the height of the highest column, they fill the space.

    Does this work?
     
    #5 Claus Faber, Aug 25, 2022
    1. PRO MEMBER PERKS Divi Block Pro - 30+ premade custom header designs for you to choose from:View Demo
(You must log in or sign up to post here.)