title: React truncate text by line
body: <p>I need to truncate card title (text) with react. </p>
  
  <p><a href="https://i.stack.imgur.com/Lljcv.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Lljcv.png" alt="enter image description here"></a></p>
  
  <p>I try to use dotdotdot component <a href="https://www.npmjs.com/package/react-dotdotdot" rel="nofollow noreferrer">https://www.npmjs.com/package/react-dotdotdot</a> but it doesn't work with simple component. </p>
  
  <pre><code>const content = ({title}) =&gt; &lt;Dotdotdot clamp={2}&gt;&lt;p&gt;Lorem ipsum dolor sit amet consectetur adipisicing elit. Est rem magni totam quos sapiente aliquid praesentium quae sint illo quas dicta cum illum dolorum quis eveniet, corrupti porro placeat, consequatur reprehenderit aliquam distinctio voluptates voluptate, temporibus omnis. Cum quis tenetur laborum minus accusantium provident eveniet, corrupti, reiciendis aliquam suscipit hic?&lt;/p&gt;&lt;/Dotdotdot&gt;
  </code></pre>
  
  <p>It doesn't work in ie11 and mozilla. 
  In <code>-web-kit</code> i have <code>-webkit-line-clamp</code> but in mozilla and ie it doesn't work.</p>
  
  <p>Do anybody know decision for this task?</p>