jquery，phonegap：unsorted列表覆盖重叠列表的内容

Question

我正在jquery mobile的帮助下开发一个phonegap应用程序。它有一个未排序的列表，可以在android下正常工作，但不能在ios下正确显示内容。

List在我的html文件中看起来像这样： <ul id="bookingList" data-role="listview"></ul>

并填充了jscript：

$('#mainList').append( "<li data-role='list-divider'>" + mainListNumber + "Nr." + endTag + mainListSwappingPreference + "T" + endTag + mainListName + "Name" + endTag + mainListReadyStatus + "Status" + endTag + mainListLastActionDate + "Datum" + endTag + "</li>");

for ( var object in mainList) {

$('#mainList').append("<li>" + mainListNumber + mainList[object].mainListNumber + endTag + mainListSwappingPreference + mainList[object].swappingPreference + endTag + mainListName + mainList[object].firstname + " " + mainList[object].surname + endTag + mainListReadyStatus + mainList[object].readyStatus + endTag + mainListLastActionDate + dateFormat(mainList[object].lastActionDate, false) + endTag + "</li>");

}

所以有两个基本的附录。

使用以下css进行设计：

#bookingTitles { font-size: 20pt !important; font-weight: bold; }

#bookingStartDate { float: left; width: 85pt; margin-left: 1pt; }

#bookingLoc { float: left; width: 65pt; margin-left: 10pt; }

知道为什么在ios上打破布局？ 提前谢谢。

截图： 机器人：

IOS：

Answer 1

我忘了我的css覆盖了listview的jquery样式，当然错误就在那里：

.ui-li-divider,.ui-li-static {
padding: 1pt !important;
}

这样做叠加的高度不再与文本的高度相匹配。正确的版本是：

.ui-li-divider,.ui-li-static {
padding-left: 1pt !important;
padding-right: 1pt !important; }

愚蠢的错误。大家都在寻找。