My Image

MatchHeight

Stack for RapidWeaver

What does it do?

Match Height is an extremely easy to use utility to equalize the heights of various elements.

You can either choose to equalize all stacks you drop in of a particular type via a simple selector or just certain stacks by giving them a match ID.

The match height stack uses the industry standard MatchHeight.js library as used by:

Integrations

No Requirements

Match Height will work in any RapidWeaver theme and has no special requirements.

There are pre-set selections for many popular stacks. It works our the the box with the default column stacks as well as the columns from Foundation and Foundry.

Easy to Use

Out of the box, Match Height is configured to handle a majority of your needs. However, you can enabled advanced rules that allow you to control the heights of your page elements based on multiple conditions.

 

AltTextMatchHeight

Easy to Use

Match Height has a simple and clear edit mode interface.

Quickly see what is matched.

Uses the power of Stacks3 child stacks to simplify setup.

Simple & Robust

The height of any column stack is handles out of the box. Just add the stack to your page and you are done.

Flexible

Add as many or as few targets to your stack as you need.

Match items by grouping them with a unique id

Choose to cancel when items are not on the same row with one simple checkbox.

Option to cancel between breakpoints.

In this example, you will notice that not just the cards are the same size. There are multiple elements in this setup that have their heights matched. The headers on all 3 pricing tables are the same height. The content areas in the middle have also been matched.

A Header

Some content would go here. Perhaps a list of features.

Our starter pack
Great Value

A Much Longer Wrapping Header

Some content would go here. Perhaps a list of features.

OUR BEST DEAL

Our best value pack
Great for most users
Useful Features
Extra Features
Lifetime Features
Our Most Popular Product

Another Header

Some content would go here. Perhaps a list of features.

Corporate pack
Unlimited licenses
Even more features
24/7 support hotline
Personal Contact Point

In this example, you will see that we have 2 groups of match rules. You will see that each group will match the height of the members in its group on a row by row basis. This provides the most concise UI.

  • Match Group 1

    Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Felis aliquet egestas

  • Match Group 2
  • Match Group 1
  • Match Group 1
  • Match Group 2

    Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Felis aliquet egestas vitae, nibh ante quis quis dolor sed

  • Match Group 2
  • Match Group 1

    Lorem ipsum dolor

  • Match Group 2

    Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Felis aliquet egestas vitae, nibh ante quis quis dolor sed mauris.

  • Match Group 1
  • Match Group 2

    Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc quis quis dolor sed

Addons Used to Build This Page


The following addons were used to build this page….