Possible to set equal height for divs in pairs but only if browser width 960 or wider?

Posted by CreateSean on Pro Webmasters See other posts from Pro Webmasters or by CreateSean
Published on 2012-10-30T00:49:27Z Indexed on 2012/10/30 5:22 UTC
Read the original article Hit count: 370

Filed under:
|
|
|

I'm working on a responsive site where I've found that I've got pairs of divs with heights that I would like to be equal, but only if the browser width is equal to or greater than 960px. Any smaller than that and the divs stack so different heights do not make a difference.

DIV 1 | DIV 2 DIV 3 | DIV 4 DIV 5 | DIV 6 DIV 7 | DIV 8

Based on the above set up, Div 1 and Div 2 need to be equal height as do Div 3 and Div 4, but both pairs do not need to be equal to each other. i.e. the pair sets can have different heights but each pair must be equal.

Is this possible and if so what is the best approach to take? My javascript/jQuery is rather elementary. I'm sure I could do equal heights alone, but with the pair sets I'm not sure and then adding in the need to set this to only happen if the browser is 960 or wider and I'm lost.

© Pro Webmasters or respective owner

Related posts about html

Related posts about css