Réglage du débordement: masqué correctement

Question

cette question est née de another question.

This fiddle montre 1 élément div extérieur et 5 élément div intérieur.

Comment puis-je définir overflow:hidden; dans le par. dernier div-élément interne avec un échantillon width:60px; et un échantillon height:44px;?

Savez-vous pourquoi cela ne fonctionne pas dans mon cas? Editer: Pourquoi dois-je utiliser une autre div pour définir un dépassement de capacité: caché here?

Answer 1

C'est parce que vous utilisez display: table-cell;

http://bytes.com/topic/html-css/answers/153857-how-can-i-force-clipping-text-table-cell

Answer 2

grâce à @ sunn0 je pourrais comprendre que vous devez ajouter un <span> par exemple, qui sera compatible avec overflow:hidden;

<div id="myid"> 
    <ul> 
    <li><span class="content">my content</span></li> 
    <li><span class="content">my other content</span></li> 
    </ul> 
</div> 

(Dans mon exemple, il était <li> qui a refusé de cacher la débordement)

#myid ul li{ 
    list-style-type: none; 
    width: 110px; height: 20px; 
    display: table-cell; 
} 

#myid ul li span.content{ 
    display: block; 
    width: 110px; height: 20px; 
    overflow: hidden; 
}