IÓNICA tiene dos problemas acerca de word-wrap en ion-elemento:
1. Cadena ser truncado por los puntos que se anexa al final, cómo mostrar el contenido completo sin puntos ?
2. Saltos de línea automáticos y sensible no funciona en Firefox (Chrome está bien), ¿cómo solucionar este problema en Firefox ?

<div class="row responsive-sm">
<div class="col">
    <div class="item item-body">
        <ion-item class="wrap" style="word-wrap: break-word; word-break: break-all;">
        #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion 
        </ion-item>
    </div>
</div>

Cualquier ayuda sería muy apreciada. Saludos.
Aquí está Lleno de HTML para mostrar el problema
codepen

InformationsquelleAutor DinDin | 2015-09-01

5 Comentarios

  1. 105

    Para iónico 1:

    Agregar item-text-wrap clase a la partida.

    <ion-item class="item-text-wrap">
      some long string
    </ion-item>
    

    Para iónico 2:

    Agregar text-wrap atributo a la partida.

    <ion-item text-wrap>
      some long string
    </ion-item>
    
    • Yo uso class=»wrap elemento de ajuste de texto» style=»word-wrap: break-word; word-break: romper todo;», y ahora ya funciona, gracias.
    • funciona en iónica 4 también. Gracias. Pero reducir el tamaño del texto. Gracias de nuevo 🙂
  2. 97

    Iónica 2, utilice el text-wrap atributo

    <ion-item text-wrap>
      text here wraps to multiple lines
    </ion-item>
    
    • hola , el ion-elemento sin necesidad de ajuste de texto sólo muestra una línea con puntos suspensivos.. cómo configurarlo para que permita las 2 de la línea y, a continuación, los puntos suspensivos… cuando la inspección de ion-item la configuración en ion-label que incluye text-overflow , overflow y white-space puede ayudar, gracias
    • esta es la correcta. probado en iónica 3 y se corrigió.
    • Esto no parece estar funcionando para mí. He tenido que cambiar el <ion-label> a white-space: normal;
    • funciona en iónica 4 también. Gracias. Pero reducir el tamaño del texto. Gracias de nuevo 🙂
  3. 1

    Para Iónico 4, uso text-wrap en su ion-label elemento, así:

    <ion-item>
        <ion-label text-wrap>
             Multiline text that should wrap when it is too long
             to fit on one line in the item.
        </ion-label>
      </ion-item>
    
    • Excelente funciona a la perfección… gracias…
  4. 0

    Iónico 4

    class=»ion-ajuste de texto»

      <ion-item>
        <ion-label class="ion-text-wrap">Long Text</ion-label>
      </ion-item>
    

    Enlace

Dejar respuesta

Please enter your comment!
Please enter your name here