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

我有一个div，其

位置：relative

为空，但它用javascript渲染的图像填充。目前，尽管我分别将宽度和高度设置为10%和20%，但div没有高度或宽度，除非我实际在其中放入一些html。我想避免使用绝对像素尺寸，因为屏幕尺寸不同。如何解决这个问题

编辑：正在讨论的div

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

---

若要使用基于百分比的维度，父元素必须具有维度。父对象上的这些维度也可以是百分比，但父对象的父对象必须具有某些维度

---

请在此处查看：

可能父元素已设置为其内容的大小。

此div的包装是什么？你能发布相关元素的html吗？这里没有太多代码，只有一个空div。我在上面的编辑中发布了它。所以我必须在某个地方使用px宽度？使用这种方法是否可以避免不同屏幕大小的问题？不，每个家长也可以有一个百分比维度，一直到您的身体标签。div直接位于身体标签内，身体标签的高度和宽度为100%。但它仍然没有出现。。我已经发布了上面的css。将css规则更改为

html，body{width:100%；height:100%；}

Hmm，现在div有了高度和宽度，宽度是正确的，但高度似乎是任意的。根据控制台显示，1092x20px更像是5%，而不是25%，尽管“计算高度”显示为25%。

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

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