jQueryMobile ListView Обтекание текстом

В jQueryMobile списки обрезают текст. Есть много статей и сообщений, подобных этому которые говорят добавить пробел: нормальный в css.

Однако у меня это не работает в jQueryMobile 1.4. Вы можете увидеть здесь. Для проверки вам нужно уменьшить размер окна браузера. Любые идеи?


css jquery-mobile jquery-mobile-listview
person Tim Hoolihan    schedule 02.02.2014    source источник

Ответы (2)


arrow_upward
18
arrow_downward

Учитывая вашу разметку LI:

<li>
  <a href="#">
    <img src="http://pbs.twimg.com/profile_images/1225696765/29072010042_normal.jpg" />
    <h3 class="wrap">Marco Alberto Sotelo (@marcosotelo79)</h3>
    <p>Sun Feb 02 20:01:24 +0000 2014</p>
    <p class="wrap">Ya estamis en el estadio MetLife para el @SuperBowl #SBUniversal http://t.co/80 /1wSo5O9E</p>
    <br />
    <img src="http://pbs.twimg.com/media/Bffo-1MCIAEoY5X.jpg" style="max-width: 90%; margin: auto;" />
  </a>
</li>

Измените обертку класса на:

.wrap {
    white-space: normal !important;
}

!important позволяет классу переопределить все классы jQM, которые устанавливают для него значение nowrap.

Вот ДЕМО

person ezanker    schedule 02.02.2014
comment
это странно. Ваша демонстрация работает, но я не могу заставить ее работать на моей странице. Я даже поместил стиль прямо в заголовок html. - person Tim Hoolihan; 03.02.2014
comment
это было потому, что я перешел в другой класс. вернулся и теперь работает. Благодарность! - person Tim Hoolihan; 03.02.2014

arrow_upward
1
arrow_downward

попробуй это

<li><p class='ui-li-desc'>Text to be displayed</p></li>
person ajitksharma    schedule 02.02.2014