jquery mobile listview не заполняет правую часть списка

Question

У меня есть список (без значков справа), и я хотел бы использовать всю ширину списка.Я не знаю, как поступить.У меня есть лишние пробелы справа ???

Вот jsFiddle: http://jsfiddle.net/fPt67/

1-я проблема: текст моего абзаца не включен в мой список

2-я проблема: мне не удалось использовать всю ширину списка.Справа всегда есть пробелы, которые не используются.

Спасибо.

Answer 1

У меня была та же проблема, не только со стилем списка, но и с другими стилями JQM. Кажется, этого недостаточно для создания собственного стиля CSS - необходимо переписать стили JQM.

Создайте файл .css, который загружается после CSS JQM, который содержит это:

.ui-li .ui-btn-inner a.ui-link-inherit, .ui-li-static.ui-li {
padding: .7em 15px .7em 15px;

}

Это удаляет дополнительный отступ справа (75 пикселей по умолчанию) в списках просмотра начиная с бета-версии JQM 1.

Answer 2

Раньше у меня была такая же проблема, пока я не понял, что использую заполнение в нижнем колонтитуле (там нет нужного места для меня).

Устранение этой проблемы должно решить только удаление нижнего колонтитула.

Переопределение стилей списков удалит все пробелы из всех ваших списков, кстати.

Answer 3

Ну, вы можете играть с ним, пока вы не получите его так, как вам нравится: http://jsfiddle.net/fPt67/12/

    <div data-role="page" id="page1" style="min-height:100%"> 

        <div data-role="header" data-position="inline" > 
        </div> 

        <div data-role="content"> 

            <ul data-role="listview" data-inset="true" data-theme="d" data-divider-theme="e" style="white-space:normal"> 
                <li data-role="list-divider" role="heading" class="ui-li ui-li-divider ui-btn ui-bar-e ui-corner-top">Paris</li> 
                <li class="custom_1">
                    <h3>
                    This is a description.
                    </h3>

                    <span class="custom_2">
                        Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
                    </span>


              </li> 

           </ul> 

        </div> 

    </div> 

CSS

.custom_1 {
    margin:0px;
    padding:0px;  
}

.custom_2 {
    font-family:"Times New Roman", Times, serif;
    font-style:normal;
    font-size:10px; 
    margin:0px;
    padding:0px;
}