Set height with zurb-foundation grid -


i'm using zurb-foundation.

is there way set 2 grid same height, if horizontally arranged. , if vertically arranged want set different height.

<div class="row"> <div id="left" class="large-4 columns"> <div id="right" class="large-8 columns"> </div> 

for example if "left" grid has 400px height , "right" grid has 300px height, want set right grid 400px far horizontal. in small display smartphone arranged vertically. in case, want set "right" grid original height(300px).

how can it?

the best way using simple js remedy. have been using foundation years , fail-safe code.

<script> $(window).load(function() {     //call equalize height function     equalheight($("div.small-item"));      //equalize function     function equalheight(group) {         tallest = 0;         group.each(function() {             thisheight = $(this).height();             if(thisheight > tallest) {                 tallest = thisheight;             }         });         group.height(tallest);     } }); </script> 

this give div classes of "small-item" equal height column. based on tallest columns height:


Comments

Popular posts from this blog

How to mention the localhost in android -

php - Calling a template part from a post -

c# - String.format() DateTime With Arabic culture -