How can I stretch elements to the same height?

When having several content boxes or texts in columns next to each other, often the layout is tricky when these elements do not have the same height (e.g. because of different text lengths). However, we offer several ways to make sure, your content looks good:

  • Headline & Paragraph Block

In the headline & paragraph block we have added an option that enables you to force each block to have the same number of lines, even if the texts have different lenghts:

Backend screenshot showing the
Backend screenshot showing the "text lines" options in the paragraph & headline block

Backend screenshot showing the "Text Lines" option, available in heading & paragraph blocks.

  • Content Boxes

When working with several content boxes next to each other, you can work with minimum heights to make sure that all boxes have the same height even when filled with shorter content - even individually per breakpoint. Just set the size of the biggest contentbox on each breakpoint as the minimum height for all other boxes.

Backend screenshot showing the minimum & maximum height option for content boxes
Backend screenshot showing the minimum & maximum height option for content boxes
  • Columns

In the advanced settings of the columns block, you will find an option to stretch elements placed in that column to the same height.

Backend screenshot of the columns block showing the
Backend screenshot of the columns block showing the "stretch to same height" option
Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us