HTML tutorial
CSS3 tutorial
Bootstrap tutorial
JavaScript tutorial
JQuery tutorial
AngularJS tutorial
React tutorial
NodeJS tutorial
PHP tutorial
Python tutorial
Python3 tutorial
Django tutorial
Linux tutorial
Docker tutorial
Ruby tutorial
Java tutorial
C tutorial
C ++ tutorial
Perl tutorial
JSP tutorial
Lua tutorial
Scala tutorial
Go tutorial
ASP.NET tutorial
C # tutorial
We can add a container element data-equalizer
property, and add to each sub-element data-equalizer-watch
property to create an identical height equalizer. The highest element determines the height of the other elements.
Note: The slider requires JavaScript. So you need to initialize oundation JS:
On equalizer by adding data-equalizer-mq=" value "
mq attribute set to the same height for different screen sizes. Value can be one of the following:
value | description | Examples |
---|---|---|
medium-up | default. Create the same container height, width greater than 40.063em | |
large-up | Create the same container height, width greater than 64.063em | try it |
xlarge-up | Create the same container height, width greater than 90.063em | try it |
xxlarge-up | Create the same container height, width greater than 120.063em | try it |
The data-equalizer
and data-equalizer-watch
add the same value of the property. This can be connected together to the equalizer container. Repeatedly nested equalizer, make sure they are a match: