Okay
  Public Ticket #4522001
QTIconBox height
Open

Comments

  •  1
    LukeNeoRm started the conversation

    Hello, I have a section with 3 columns, 1 QTIconBox per column. How can I force the height of each QTBox to be the same?

    Attached files:  2025-12-01 21_56_54.png

  •  1,838
    Barry replied

    Hi there,

    Thank you for your message.

    Unfortunately there is no setting in Elementor to do this, the only way is to add a custom class to the page builder row and add CSS code to make the icon boxes equal in height.

    You can do this by following these steps:

    1. Edit the page builder row that hold the 3 columns and click the "Advanced" tab
    2. Add "equal-height" to the "CSS Classes" input field
    3. Copy/paste the following CSS code to Appearance -> Customize -> Additional CSS:
    /* fix to make icon boxes equal height */
    .equal-height .elementor-container > .elementor-column {
    	height: auto;
    }
    .equal-height .elementor-widget-container,
    .equal-height .elementor-element {
    	height: 100%;
    }
    
    .equal-height .icon-box {
    	height: 100%;
    	display: flex;
    	align-items: center;
    }

    Please see first attached image for step 1 and 2.

    Hope this helps, let me know if you have any questions.

    Attached files:  custom class.png

    Best regards,
    Barry
    QreativeThemes.com  |  WordPress Themes