A common task when implementing a website is to handle the height equality of components in one row even though the content might differ. SXA has an already inbuild solution.
I just added three out of the box Promo Component into one row in my main placeholder. And I set the promos to be threee in a row with a width of 4 col each.
Now go into the rendring parameters and check the "Equal height with other promos" style of each promo. This comes out of the box and is available in your Style Folder <Site>/Presentation/Style/Promo
After having done this for all promo components in that row go to the rendering parameters of the Row Placeholder and set the "Equalized Content" Style in the "Container" section.
To see your changes you have to save the page. So no matter what differences you have in text or images the component is of equal height.