title: CSS - font size 100% of the containing div (element)
body: <p>Ok. Here is the thing. <br/>Like we can use <code>width:100%</code> of an element and it'll take the full width of its container. How can we do that in case of fonts? 
  I have tried using 100% or em etc but that's not working. </p>
  
  <p>Let me explain the actual problem. Here are three versions of a div. Please see the images.</p>
  
  <p>1- Desktop</p>
  
  <p><img src="https://i.stack.imgur.com/2qxfS.png" alt="enter image description here"></p>
  
  <p>2- Android
  <img src="https://i.stack.imgur.com/vTtOl.png" alt="enter image description here"></p>
  
  <p>3- iPhone
  <img src="https://i.stack.imgur.com/A0Nte.jpg" alt="enter image description here"></p>
  
  <p>You can see that the text "Quote and Buy Online" is in the same line for Desktop and Android (which is the requirement) while it is in two lines in iPhone. Whereas the font-size is the same for all three. Now, that's the problem.</p>
  
  <p>One way is that I reduce the size of the font until the problem gets solved for iPhone but it would then be much smaller for Desktop and Android.
  If somehow, I tell the font to adjust its size according to its containing div then the problem will be solved.</p>
  
  <p>Please note that I have checked the <a href="https://stackoverflow.com/questions/16056591/font-scaling-based-on-width-of-container">solution here</a> but It says it won't be dynamic. So looking for a better alternative.</p>
  
  <p><a href="http://bit.ly/16udX0a" rel="nofollow noreferrer">Here is the link</a> where you can find the form.</p>