请教下 我这个div怎么写的不正常显示啊？

<div id="Ibuttom" style="position: absolute; top: expression(parseInt(document.getElementById("Idata").style.height)-20+"px"); width: 100%; height: 20px; background-color: #7F7F7F;"></div>

完整的代码是

<div id="Idata" style="position: absolute; left: 240px; top: 100px; width: 512px; height: 480px; background-color: #000000;">
      <div id="Itop" align="center" style="position: absolute; width: 100%; height: 20px; background-color: #7F7F7F;"></div>
      <div id="Ibuttom" style="position: absolute; top: expression(parseInt(document.getElementById("Idata").style.height)-20)px; width: 100%; height: 20px; background-color: #7F7F7F;"></div>
      <div id="Icanvas" style="position: absolute; left: 32px; top: 32px; width: 416px; height: 416px; background-color: #000000;">

      </div>
    </div>

Ibuttom这个div是在Idata里面的，你在里面取外面的高度当然取不到了

<div id="Idata" style="position: absolute; left: 240px; top: 100px; width: 512px; height: 480px; background-color: #000000;">
      <div id="Itop" align="center" style="position: absolute; width: 100%; height: 20px; background-color: #7F7F7F;"></div>
      <div id="Ibuttom" style="position: absolute;width: 100%; height: 20px; background-color: #7F7F7F;"></div>
      <div id="Icanvas" style="position: absolute; left: 32px; top: 32px; width: 416px; height: 416px; background-color: #000000;">

      </div>
    </div>

<script type="text/javascript">

document.getElementById("Ibuttom").style.top=(document.getElementById("Idata").clientHeight-20)+"px";

</script>