Why webkit line clamping does not work in firefox?

Question

I use this webkit line clamp, it works in Chrome, but not in Firefox. The following is the code:

{
  overflow: hidden;
  text-overflow: ellipsis;
  display: -we         


        

Answer 1

In firefox, -webkit-line-clamp don't work

Here a javascript code that works fine
http://codepen.io/nilsynils/pen/zKNpkm?editors=1111

const containers = document.querySelectorAll('.container');
Array.prototype.forEach.call(containers, (container) => {  // Loop through each container
    var p = container.querySelector('p');
    var divh = container.clientHeight;
    while (p.offsetHeight > divh) { // Check if the paragraph's height is taller than the container's height. If it is:
        p.textContent = p.textContent.replace(/\W*\s(\S)*$/, '...'); // add an ellipsis at the last shown space
    }
})