2017-10-09 3 views
0

J'ai une largeur fixe td. Le texte à l'intérieur ne doit pas aller à la deuxième ligne. Si le texte est plus long que la largeur de la cellule, il doit être coupé au dernier mot. S'il n'a pas d'espace et ne peut pas passer au dernier mot, il doit rompre avec la largeur maximale de la cellule. Pour cet exemple https://www.w3schools.com/cssref/tryit.asp?filename=trycss3_word-wrap, je souhaite que la cellule ait uniquement le mot "Ce paragraphe contient un". J'ai l'impression que c'est une combinaison de mots-break et d'espaces blancs: pas de bouclage mais je n'arrive pas à le faire fonctionner.Couper le texte au dernier mot si plus long que la largeur de la cellule du tableau

+0

Vous cherchez quelque chose comme overflow-x: caché? Ou même overflow-x: montré? –

+0

vous pouvez essayer ** texte-débordement: ellipses; ** il mettra * ... * à la fin de notre texte – LSKhan

Répondre

1

Pouvez-vous régler la hauteur? Si vous faites cela et que vous cachez le débordement, il ne devrait montrer que ce que vous voulez.

p.test { 
 
    width: 11em; 
 
    border: 1px solid #000000; 
 
    word-wrap: break-word; 
 
    overflow: hidden; 
 
    height: 1em; 
 
}
<p class="test"> This paragraph contains a very long word: thisisaveryveryveryveryveryverylongword. The long word will break and wrap to the next line.</p>

0

Essayez d'utiliser Html

<div> 
This is my div and it has some fixed width only allow text to show in one line 
</div> 

CSS

div{ 
    width: 120px; 
    color :black; 
    text-overflow: ellipsis; 
    white-space: nowrap; 
    overflow: hidden; 
} 

Working fiddle here