Equal height columns within a group

Problem description A common problem in email design (and web) design is to have content of the same height standing side by side. Content should be responsive in mails, but the mj-group tag allows you to prevent stacking if certain content should really be displayed side by side. This is a simple example of what we want to achieve:

There are many variations of this requirement, but in the end it is always about making two columns (mj-column) the same height for different aspects of styling (background colors, background images, common alignment lines, ...).

Possibilities to solve it currently Currently, the problem can only be solved by assigning the same fixed height to each column. This is feasible for one-time mailings created by a programmer/designer, but it's a very complex thing because the slightest text change requires new height values. Additionally it is not guaranteed that the height specification will work everywhere because the different operating systems render fonts slightly different and therefore different line breaks and text heights could occur.

The approach does not work at all with dynamically generated mails consisting of e.g. contents from a database.

Highlighting the current technical state The following MJML code creates the following mail with columns not of the same height:

<mjml>
  <mj-body background-color="#2980b9" width="610px">
    <mj-section background-color="#3498db" padding="5px">
      <mj-group>
        <mj-column background-color="#c0392b" width="50%">
          <mj-text>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam.</mj-text>
        </mj-column>
        <mj-column background-color="#e67e22" width="50%">
          <mj-text>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.</mj-text>
        </mj-column>
      </mj-group>
    </mj-section>
  </mj-body>
</mjml>

Why automatic columns of the same height are currently not possible Currently, mjml-column tags are rendered in the same way whether they are in a section or group. This happens because an AST is created based on the markup and each tag renders itself and only inserts the markup of the rendered child nodes in the correct places.

The resulting markup looks something like this:

<div mjml-group>
    <outlook-table>
        <outlook-row>
            [for every column in group]
                <outlook-colum width="together 100%">
                    <div mjml-column width="together 100%" />
                </outlook-colum>
            [/for every column in group]
        </outlook-row>
    <outlook-table>
</div>

In contrast to sections the columns do not stack because they are assigned a fixed width which together results in 100% width. The generated markup is absolutely useful because a column is always rendered the same way and only the parent (section or group) controls the width differently.

A common height is not possible because divs in a div (or table column) cannot be instructed to have the same height.

Possible solution to the problem The group renderer will not just render its markup and let the mjml-column renderer create the content. The Group Renderer will do the rendering of itself and its columns and will only handover rendering the contents of the columns to these child components.

Thus it is possible to create new markup for columns in a group and to render groups and columns simply as a table. It would look something like this:

<table mjml-group>
    <tr>
        [for every column in group]
            <td background color and images applied here width="together 100%">
                <markup to implement features like padding etc>
                    <child renders inserting the real content here>
                </markup>
            </td>
        [/for every column in group]
    </tr>
</table>

Addendum This feature is not only limited to people using the mjml markup language. It's not possible to do it in mailjets visual builder too which is based on mjml: