title: Fit text perfectly inside a div (height and width) without affecting the size of the div
body: <p>I apologise in advance as I know this question has come up many times before but I just can't seem to find the right solution (and believe me I've tried a few!)</p>
  
  <p>Basically it's the old "<strong>Fit text perfectly inside a div without affecting the size of the div</strong>". And unless I'm a complete numpty, I believe CSS has no way of doing this. So what I mean basically is rather than doing something like:</p>
  
  <pre><code>#someDiv {
  font-size: 12px;
  }
  </code></pre>
  
  <p>or...</p>
  
  <pre><code>#someDiv {
  font-size: 1em;
  }
  </code></pre>
  
  <p>...I want to be able to do something like this:</p>
  
  <pre><code>#someDiv {
  font-size: fluid;
  }
  </code></pre>
  
  <p>...meaning that whatever text this div contains, scale it to fit perfectly from left to right and top to bottom with no overflow or whitespace.</p>
  
  <p>After trawling through countless websites looking for this CSS solution, I've now accepted that CSS isn't capable of this ...so, enter jQuery.</p>
  
  <p>I've found several jQuery solutions online but they will only scale the text to fit the width, but I want it to scale to the height as well. So effectively I want to say to jQuery:</p>
  
  <p><strong>"jQuery, find $(this) div and whatever text is inside it I want you to scale it so that it fills the entire height and width of the div as tightly as possible".</strong></p>
  
  <p>In case I haven't explained myself very well, I've attached a graphic explaining the problem I'm facing and the solution I'm looking for.</p>
  
  <p>Any help would be much appreciated. Thank you.</p>
  
  <p><img src="https://i.stack.imgur.com/A5VUE.jpg" alt="enter image description here"></p>