具有固定大小的空相对div？

Question

我有一个position:relative;的div是空的，但它填充了一个javascript渲染的图像。目前，即使我已经分别设置了10％和20％的宽度和高度，div也没有高度或宽度，除非我实际上放了一些html。我想避免使用绝对像素尺寸，因为屏幕尺寸不同。怎么解决这个问题？

编辑：有问题的div

<div id="protovis">
</div>

CSS：

body 
{
  width:100%; height:100%;
  margin:0;
  ...
}

#protovis
{
  margin-left:10%;
  width:80%; height:25%;
  position:relative;
}

Answer 1

要使用基于百分比的尺寸，父元素必须具有尺寸。父母的这些维度也可以是百分比，但父母的父母必须有一些维度。

请在此处查看：http://jsfiddle.net/NWWY8/

Answer 2

也许父元素的大小设置为其内容。