我正在使用带有嵌套均衡器的均衡器来制作一个带有嵌套<h2>
对象的文章对象,网格布局中的高度相同。
因此所有<article>
元素的高度相同,文章中的所有<h2>
元素都具有相同的高度。
http://foundation.zurb.com/sites/docs/v/5.5.3/components/equalizer.html
只要网格布局没有扩展到第二行,一切正常,均衡器可以做到。
但第二个网格布局扩展到第二行均衡器将高度设置为
高度= “继承”
<article>
和<h2>
(文章中)元素都失去了相同的高度。
我还尝试将h2元素放在div元素中,并在此处使用data-equalizer-watch="sub2"
,但结果相同。
<div id="siteContent" class="row" data-equalizer="sub1">
<div data-equalizer="sub2">
<div class="small-12 medium-6 large-4 columns panel articleFrontpage" data-equalizer-watch="sub1">
<a href="#">
<article>
<time datetime="2015-12-31" pubdate="pubdate"></time>
<h2 data-equalizer-watch="sub2">Super long headline if u believe. Let the force guide you</h2>
<div>
<p>News category<span> <span>2015-12-31</span></p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eget quam interdum, elementum tellux asdasd asasdasdasda , elementum tellux asdasd asasdasdasda</p>
</div>
</article>
</a>
</div>
<div class="small-12 medium-6 large-4 columns panel articleFrontpage" data-equalizer-watch="sub1">
<a href="#">
<article>
<time datetime="2015-12-31" pubdate="pubdate"></time>
<h2 data-equalizer-watch="sub2">headline</h2>
<div>
<p>News category<span> <span>2015-12-31</span></p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eget quam interdum, elementum tellux asdasd asasdasdasda , elementum tellux asdasd asasdasdasda</p>
</div>
</article>
</a>
</div>
<div class="small-12 medium-6 large-4 columns panel articleFrontpage" data-equalizer-watch="sub1">
<a href="#">
<article>
<time datetime="2015-12-31" pubdate="pubdate"></time>
<h2 data-equalizer-watch="sub2">headline</h2>
<div>
<p>News category<span> <span>2015-12-31</span></p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
</div>
</article>
</a>
</div>
<div class="small-12 medium-6 large-4 columns panel articleFrontpage" data-equalizer-watch="sub1">
<a href="#">
<article>
<time datetime="2015-12-31" pubdate="pubdate"></time>
<h2 data-equalizer-watch="sub2">headline</h2>
<div>
<p>News category<span> <span>2015-12-31</span></p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
</div>
</article>
</a>
</div>
</div>
</div>
希望有人可以提供帮助