If Im building a row with several column and for each column the content needs to align across the row, is there a better way to do it than using multiple data-equalizers.
For instance each column has a header, content and footer. On some columns the header is one line long on others its multiple lines, but I want the content below to all align rather than look staggered
At the moment I’m doing:
<div data-equalizer="header">
<div data-equalizer="content">
<div class="grid-x grid-padding-x">
<div class="cell small-4 flex-container flex-dir-column">
<div class="callout primary" data-equalizer-watch="header">
<h3>Header 1</h3>
</div>
<div class="callout primary " data-equalizer-watch="content">
<p>Content</p>
</div>
</div>
<div class="cell small-4 flex-container flex-dir-column">
<div class="callout primary" data-equalizer-watch="header">
<h3>Header 1</h3>
</div>
<div class="callout primary " data-equalizer-watch="content">
<p>Content</p>
</div>
</div>
</div>
</div>