<h1>Responsive Text Length</h1>
<h2>Shrinking Text Based on Character Count</h2>
<h2>200 Characters</h2>
<p>MMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMX</p>
<h2>250 Characters</h2>
<p>MMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMX</p>
<h2>300 Characters</h2>
<p>MMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMX</p>
<h2>350 Characters</h2>
<p>MMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMXMMMMX</p>
p {
  word-break:break-all;
}
@element 'p' {
  $this:after {
    content: 'eval('innerHTML.length') characters and eval('clientHeight')px';
    display: block;
  }
}

p {
  font-size: 12pt;
}
@element 'p' and (min-characters: 250){
  $this {
    font-size: eval("100-(innerHTML.length-250)/(clientWidth/10)")%;
  }
}

External CSS

  1. https://fonts.googleapis.com/css?family=Fira+Sans:300,400,500,700,300italic,400italic,500italic,700italic
  2. https://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,600,700,900,200italic,300italic,400italic,600italic,700italic,900italic
  3. https://fonts.googleapis.com/css?family=Source+Code+Pro:300,400,500,600,700,900
  4. https://s3-us-west-2.amazonaws.com/s.cdpn.io/67439/basic.css

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/eqcss/1.2.1/EQCSS-polyfills.min.js
  2. https://cdnjs.cloudflare.com/ajax/libs/eqcss/1.2.1/EQCSS.min.js