Question

I’m adapting a wordpress theme and it would be nice to have the text of the whole page scale depending on the width of each container div.

So far all the widths are in % but as w3c mentions the font-size property only takes into account the font-size of the parent and not the size of the container div.

As multiple other answers hint, I could do that with javascript and target each container div,
which though being a very helpful answer from my point of view doesn’t apply to my problem because I dont know all the possible container ids or classes since I have to account for future plugin installations which could output text, e.t.c.

so is there any other way to do this?

Answer 1

Not without Javascript. CSS bases font-size percentages based on height of a line, there are no width-based controls.

I’d strongly recommend changing your design.

If you want to try to go with it, I’m not sure how proficient you are at Javascript, but you could iterate through DOM nodes, look for a common condition, find the width of the DIV, and move forward that way.