Переполнение текста в Android / WebKit: многоточие не работает

Question

Я пытаюсь заставить следующий код работать на телефоне androind 2.1 (пользовательский интерфейс HTC Sense):

h1 {
    font-size: 14px;
    font-weight: bold;
    color: #FFF;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;   
}

, однако свойство переполнения текста, похоже, не работает.Кто-нибудь еще имел эту проблему, или нашел способ обойти ее?

Answer 1

на Android 2.2 и 4, я использую высоту строки больше размера шрифта (всегда em) с типом отображения «-webkit-box» и вертикальной ориентацией.

Вот пример:

.myClass{
display     : -webkit-box;
-webkit-box-orient  : vertical;
text-overflow   : ellipsis;
-webkit-line-clamp  : 3;
overflow        : hidden; 
font-size       : 0.9em;
line-height     : 1.2em;
}

Answer 2

Я вижу, что вы не определили ширину. Если элементу разрешено расширяться произвольно, переполнение> внутри > элемента никогда не произойдет. Элемент, переполняющий родительский элемент, не даст желаемого эффекта.

Answer 3

Кажется, что «многоточие» не работает, когда ваш «дисплей» установлен на «-webkit-box», сброс на «блок» будет делать.Это может помочь: https://bugzilla.mozilla.org/show_bug.cgi?id=672944#c0