css - Responsive Font Size -

I have created a site using the Zurb Foundation 3 grid, each page has a big H1.

CSS

  body {font-size: 100%} / * header * / h1 {font-size: 6.2em; Font-weight: 500; }   
 HTML  
  & lt; Div class = "row" & gt; & Lt; Div class = "twelve column text-center" & gt; & Lt; H1 & gt; Large header tagline & lt; / H1> & Lt; / Div & gt; & Lt ;! - End tagline - & gt; & Lt; / Div & gt; & Lt ;! - End row - & gt;   
 When I change the browser to a mobile size, then large font is not adjusted and causes the browser to include a horizontal scroll to adjust for larger text.  
 I 'We have seen that on Zurb Foundation 3 typography, the headers are browser friendly because it is compressed and expanded.  
 Am I really forgetting something? How do I get it?  
  
 
 
  font size  will not respond, like resizing browser window instead They respond to browser zoom / type size settings, such as you press  ctrl  and  +  on the keyboard together in the browser.  
  Media queries   
 You will have to use some intervals to minimize the font-size, where it will start breaking your design and scrollbar Have to make.  
 For example, by changing the 320px width wherever your design is starting, try adding it to your CSS below:  
  @ Media only screens and (Max-width: 320px) {body {font-size: 2am; }}   
  Viewport percentage length   
 You can also enter  vw ,  vh  Click on  vmin  and  vmax . Official W3C documents for this state:  
 
 Viewport-percent lengths are relative to the size of initial block. The height or width of the initial block is changed, accordingly it is increased.   
 Then, from the same W3C document, each individual unit can be defined below:  
 
 VW unit - the width of initial block containing Equal to 1%  
 The VH unit - equals 1% of the initial block containing the height.  
 Varni Unit - VV or V.H. Equal to the smallest  
 vmax unit - VW or V.H.   
 and they are used like any other CSS value:  
  .text {font-size: 3vw; }. Other-text {font-size: 5 v. }   
 Compatibility is relatively good as can be seen. However, some versions of IE and Edge do not support VMax. Apart from this, there is an issue with the VH unit in iOS 6 and 7, which was fixed in iOS 8.