使用css或javascript检测MAXimum字体大小

Question

请您查看此示例代码，并告诉我代码如何确定可以放置的最大字体大小而不会破坏已定义的边框？

<div id="container">
    <img id="image" src="http://graphics8.nytimes.com/images/2010/05/23/magazine/23FOB-medium-span/23FOB-medium-t_CA0-articleLarge.jpg"/>
    <p id="text">
        Hello World  
    </p>
</div>


#container
{
    height:400px;
    width:600px;
    position:relative;
}

#image
{    
    position:absolute;
    left:0;
    top:0;
}
#text
{
    position:absolute;    
    color:white;
    font-size:90px;
    font-weight:bold;
    left:100px;
    top:100px;
    right:100px ;
    bottom:100px;      
    opacity:0.9;
    background-color:#00ff00;
}

我像这样定义了文本边框：     左：100px的;     顶：100px的;     右：100px;     底部：100像素;

http://jsfiddle.net/gNwhX/

也许我做错了一些或者这种方式不可能，你有什么建议？