Ограничить количество строк текста в Firefox

Question

Когда я загружаю этот промежуточный сайт в Firefox, я вижу следующее:

Я не вижу этого пробела в Chrome или Safari, потому что текстовое содержимое твита ограничено 3 строками по следующему правилу CSS:

#ctf p.ctf-tweet-text {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

Похоже, это правило не работает в Firefox.

Как мне ограничить количество строк текста в Firefox? Спасибо.

Вот HTML-код, создающий твит:

<div class="ctf-tweet-content">
    <p class="ctf-tweet-text" style="color: #ffffff;">A great article about keeping mining education relevant in Western Australia 
        <a href="https://twitter.com/Matt_Mckenzie_" target="_blank" rel="nofollow" style="color: rgb(255, 255, 255);">@Matt_Mckenzie_</a>
        <a href="#" title="#" target="_blank" style="color: rgb(255, 255, 255);">link</a>
    </p>
</div>

Answer 1

Этот ответ предоставляет CSS, который применяется к браузерам webkit, но имеет запасной вариант для Mozilla Firefox и других браузеров:

.giveMeEllipsis {
   overflow: hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: N; /* number of lines to show */
   line-height: X;        /* fallback */
   max-height: X*N;       /* fallback */
}