Jquery 确定动态组件的高度

我有一个两栏的页面布局。左列使用

dataTable

显示列表中的图像，因此

div

容器的高度未知。右边的列是带边框的空

div

。但是我有一个右

div

容器，它和左容器一样高。有没有办法做到这一点？这是我的布局

<div id="pdfCol"> 
    <h:form>
        <p:dataTable value="#{myBean.imgageList}" var="item">
            <p:column style="border-bottom: 2px solid red;">
                <h:graphicImage value="resources/images/#{item}"/>
            </p:column>
        </p:dataTable>
    </h:form>
</div>
<div id="noteCol">

</div>

---

所以现在，右栏的高度是

3000px

，如果有而不是很多图像，那么右栏太高，反之亦然，如果我们有很多图像，右栏就会太短。有没有办法使它们的高度相等？

可以在列加载后放置此jQuery：

$('#noteCol').css('height', $('#pdfCol').height());

---

以下是使用CSS实现等高列的一些方法：

---

我喜欢一个真正的布局方法。

很抱歉再次与您接壤，但您的方式是FireFox唯一有效的方式。这不适用于Chrome和Safari。我也不确定IE。你们有跨浏览器的解决方案吗？

$('#noteCol').css('height', $('#pdfCol').height());