javascript - jQuery: set height of to height of all its children? -
javascript - jQuery: set height of <section> to height of all its children? -
i have …
<section class="cat"> <article class="layer"></article> <article class="layer"></article> <article class="layer"></article> <article class="layer"></article> </section> <section class="cat"> <article class="layer"></article> <article class="layer"></article> <article class="layer"></article> </section>
and want set height of each section.cat
height of children. wanna jquery i'm compatible in browsers. seems there no way pure css article.layer
s set display:table
…
article.layer { position: relative; display: table; height: 100%; width: 100%; }
so articles 100% height of current viewport body
, html
set 100% height well.
right section.cat
set display:inline
works in browsers doesn't in safari 5.0.
section.cat { display:inline; }
so hence want jquery , height of each kid within section.cat
, set height value. otherwise height of section.cat
s 0 , mentioned above safari 5.0 somehow can't deal display:inline
value.
thank you!
i suggest find css equivalent to solve still if want jquery solution here is.
var totalheight; $(".cat").each(functon(){ totalheight = 0; $(this).children(".layer").each(function(){ totalheight += $(this).height(); }) $(this).height(totalheight); });
javascript jquery css html5 css3
Comments
Post a Comment