Dynamically resize text to fill div
css, html, javascript, jquery
Solution
As I said this may be a dupe of
Auto-size dynamic text to fill fixed size container.
The OP did a jQuery plugin for that means, you can download it here
It doesn't seem to up to date though!
Good luck!
Problem
I have been searching for a solution to resize the text size in a div to make the text fill out the entire div height and width, with no avail. I have made some images to help understand this problem: So this is a simple div with a height and width set. This height and width does not change, the text in the box does! So what I want to do is to make that text fill the whole width and height of the div just like in the image below. I have been working on the simple example below and I simply cannot find out how to do this. I have tried setting relative font-sizes with percentage, doing things with overflow, text-aligning all not giving me the result I want. ``` <html> <head> <title>Test</title> <style type="text/css"> #box1, #box2{ width: 400px; height: 300px; color: white; margin: 10; font-size:larger; text-align:justify; letter-spacing: 100%; } #box1 { background-color: green;} #box2 { background-color: blue;} </style> </head> <body> <div id="box1"> Llorem ipsum foo bar baz </div> <div id="box2"> Foobar </div> </body> </html> ``` Is this problem even solvable with simple CSS or will I have to do some javascript/jQuery?