jQuery mobile: Habilitar Word Wrap en ListViews

Question

Tengo una vista de lista (ver foto a continuación) que me gustaría enmendar todos los contenidos en lugar de agregar ... a las líneas largas.

¿Cómo se hace esto?

Answer 1

sólo tiene que actualizar el CSS para el elemento .ui-li-desc que contiene el texto de la lista de ítems:

​.ui-page .ui-content .ui-listview .ui-li-desc { 
    white-space : normal; 
}​ 

He aquí una demostración: http://jsfiddle.net/Xc6PJ/

Algunos buena documentación para white-space: https://developer.mozilla.org/en/CSS/white-space

Aquí hay un ejemplo de li st-artículo de mi prueba listview después de jQuery Mobile ha inicializado:

<li class="ui-li ui-li-static ui-body-c"> 
    <h3 class="ui-li-heading">Sample Title</h3> 
    <p class="ui-li-desc"> 
     Sample Content Sample Content Sample Content Sample Content Sample Content Sample Content Sample Content Sample Content Sample Content Sample Content Sample Content 
    </p> 
</li> 

Answer 2

Mi sugerencia sería utilizar un div dentro del <li> y establecer el comportamiento específico que desea en lugar de cambiar el comportamiento general del móvil del jQuery css. Con esto, puede tener solo lo específico para comportarse de la manera que desee.

Answer 3

Dentro de la sección li, añada con la sección style="white-space:normal;" que fuerza el ajuste de palabras.

Answer 4

En 1.4.4 móvil jQuery esto funcionó:

.ui-listview > li p { 
    white-space: normal; 
}