相关疑难解决方法(0)

我很困惑!有了这个:

...
<div id="main">         
    <div id="content">
        <div class="col1">
        ...COLUMN1 CONTENT GOES HERE...
        </div>

        <div class="col2">
        ...COLUMN2 CONTENT GOES HERE...
        </div>
    </div><!-- #content -->
</div><!-- #main -->
...

你看到有列,我想将容器元素的高度设置为两列的最大大小(加上130px).所以通过使用Prototype框架:

//fixing column height problem
Event.observe(window,"load",function(){             
    if(parseInt($('col1').getStyle('height')) > parseInt($('col2').getStyle('height')))
        $('main').setStyle({'height' : parseInt($('col1').getStyle('height'))+130+'px'});
    else
        $('main').setStyle({'height' : parseInt($('col2').getStyle('height'))+130+'px'});
});//observe

它在Firefox,Opera,Safari和Chrome中运行良好但它无法返回列的实际高度.在IE7 +中(未在IE6中测试),它返回NaN作为列高度.
我设法找到了因为这个:

.col1,.col2{"height:auto;"}

我还使用了"$('col1').offsetHeight"并且它返回0作为每列的高度值.

HTML以这种方式设置样式:

#main{
height: 455px;
background: #484848 url(../images/mainbg.png) repeat-x;
}
#content{
/*height:80%;*/
width: 960px;
direction: rtl;
margin-top: 50px;
margin-left: auto;
margin-right: auto;
position: relative;
}
.col1,.col2{
width: 33%;
text-align: right; …