title: Text cutting off in Internet Explorer when using text-shadow
body: <p>I recently built this website: <a href="http://billy.fm/" rel="nofollow">http://billy.fm/</a></p>
  
  <p>If you open this page in <em>Internet Explorer 11</em>, you'll see that the large title that reads <em>Samuel-613</em>, is cut off on the right.</p>
  
  <p>Disabling the <code>text-shadow</code> property on this heading in IE developer tools appears to fix the issue. </p>
  
  <p>Also, changing the blur radius to a larger number also works - but leaves me with a result I'm not after.</p>
  
  <pre><code>/* Does not work */
  .project__title {
      text-shadow: 0 0 2px #fff;
  }
  
  /* Works */
  .project__title {
      text-shadow: 0 0 10px #fff;
  }
  </code></pre>
  
  <p>Weird bug - any ideas?</p>
  
  <p>I am using <em>Internet Explorer 11</em> on <em>Windows 7</em>. This could be happening in other versions too.</p>