Fade Inline-Block mit CSS und Velocity JS

Question

Ich verwende Velocity JS, um ein Listenobjekt zu verblassen.

Das Problem ist, dass Velocity gilt display: list-item; Opazität: 1; an das Element und überschreibt meine Anzeige: Inline-Block; und meine Liste ist jetzt vertikal.

Wie kann ich es erzwingen, immer Inline-Block zu verwenden?

https://jsfiddle.net/01qvqmxa/

HTML

<ul class="myList"> 
    <li>test</li> 
    <li>test</li> 
    <li>test</li> 
</ul> 

CSS

li { 
    opacity: 0; 
    display: inline-block; 
    padding: 1em; 
} 

JS

$(".myList li").velocity("fadeIn", { delay: 300, duration: 2000 }); 

Answer 1

Versuchen Sie, die !important Notation:

li { 
    opacity: 0; 
    display: inline-block !important; 
    padding: 1em; 
} 

revised fiddle