How to set a minimum font size when using CSS3 vw or vh

When using the CSS3 font-size (viewport) units, such as vw and vh, you may have noticed that the fonts can become very small on smaller screens. To resolve this issue, you can do the following:

@media screen and (max-width: 1100px){
  font-size:35px;
}
@media screen and (min-width: 1101px){
  font-size: 3vw;
}

 
Using the media queries above, we can specify a fixed font-size of 35px for screen sizes under 1100px (for instance), and use the viewport unit vw to maintain a responsive font-size for screen sizes greater than 1101px.

This will keep the associated font from becoming unreadable on smaller screen sizes.