Styling von ui.list (Autoheight oder CSS-Überlauf)

Question

Ich versuche, den Stil des webix ui.list Widget anpassen, aber es sind zwei Fragen, die ich von mir selbst nicht lösen können:

• Gibt es eine Möglichkeit, die Autohöhe für Objekte einzustellen?

• Wenn nein, welche Klasse erlaubt `text-overflow: ellipsis?

Hier ist ein sample und der Code der aktuellen Implementierung:

CSS:

.webix_list_item{ 
    border: 1px solid #ebebeb; 
    border-radius: 5px; 
    margin:15px; 
    box-shadow: 0 0 10px rgba(0,0,0,0.2); 
    background: #fafafa;  
} 

.webix_list_item:hover{ 
    box-shadow: 0 0 10px rgba(177,44,99,0.6); 
    border: 1px solid #efefef; 
    background: #efefef; 
} 

.webix_list_item.webix_selected { 
    color: #fff; 
    background: #cac1c5; 
    border: 1px solid #bfb8bb !important; 
} 

JS (ziemlich einfach):

webix.ui({ 
    view:"list", 
    data:list_data, 
    width:230, scroll:false, 
    select:true 
}); 

Answer 1

Neben der CSS-Lösung hat webix Liste type Eigenschaft welches die Höhe der Gegenstände handhaben kann. Besonders:

type:{ 
    height:"auto" 
} 

http://webix.com/snippet/c01714d0

Answer 2

Trivial, ist das wha t erwartest du?

http://webix.com/snippet/0e340ea4

Ich habe die folgenden CSS hinzugefügt:

.webix_list_item { 
     overflow: hidden; 
     white-space: nowrap; 
     text-overflow: ellipsis; 
    } 

wenn Sie wollen Autoheight festlegen:

.webix_list_item { 
    white-space: normal; 
    overflow: visible !important; 
    height: auto !important; 
    }