How to make the text content auto fill all the space of its parent element

I have a div,which content some text content.

<div id="con" style="position:absolute;left:50px;top:50px;border:1px solid red;font-size:12px;">
    Text Here!
</div>

Note,that I do not set the "width" and "height" of the "div#con",since I do not want to see any blank space.

Now,I want to make the "div#con" resizeable,when the "div#con" resize,I want the text's fontsize inside it changed accordingly.

Any idea?

Have a look at the jQuery TextFill plugin and also to this topic with severals solutions.

I think you should find the answer.