How to resize font-size proportionally to div size

Question

I\'m trying to create a website where the pages resize to the windows size on the fly. While we can get images and such to resize automatically as a % of the div size. We do

Answer 1

How about using media queries?

Answer 2

So you can use screen.availHeight to calculate a constant value which you can multiply with the font size.

window.onload = function () {
    document.body.style.fontSize = (Math.ceil(screen.availHeight * parseInt(document.body.style.fontSize) / 600) + 'px';
}

Answer 3

even use % for text. http://w3schools.com/cssref/css_units.asp

Answer 4

Whipped up some example to adjust font-size on div size change. Using percentage in the parent div and adjusting the font-size there should do the trick.

http://jsfiddle.net/744A2/