JQuery Mobile - 布局未正确对齐

Question

我正在为本地软件开发用户组做一个演示。我正在尝试构建一个JQuery Mobile应用程序，它允许我们为下次会议投票选择不同的食物选项。选项将动态加载。因此，我必须动态构建列表。我有实际的投票功能。我的问题是，我无法让布局看起来正确。现在，按钮看起来像

如您所见，没有任何内容正确对齐。我已经尝试了各种css更改，没有任何运气。我觉得有些东西我不知道。我认为这将是相当直接的。但到目前为止，我错了。这是我的相关JavaScript：

$("#votesList").empty();
$.each(votesCollection, function (i, item) {
  var s = "<li><div class='ui-grid-a'><div class='ui-block-a'>";
  s += "<label><strong>" + item.data.name + "</strong></label><br />";
  s += "<span style='font-weight:normal;'>" + item.data.description + "</span>";
  s += "</div>";

  var v = getTotalVotes(i);
  s += "<div class='ui-block-b ui-grid-b'>";
  s += "<div class='ui-block-a'><input id='decButton" + i + "' type='button' value=' - '  data-mini='true' onclick='decrementVotes(" + i + ", \"" + item.data.name + "\");' /></div>";
  s += "<div class='ui-block-b'>&nbsp;<input id='voteText" + i + "' type='text'  data-mini='true' value='" + v + "' style='text-align:center;' />&nbsp;</div>";
  s += "<div class='ui-block-c'><input id='incButton" + i + "' type='button'  data-mini='true' value=' + ' onclick='incrementVotes(" + i + ", \"" + ps.data.name + "\");' /></div>";
  s += "</div></div></li>";

  $("#votesList").append(s);
});
$("#votesList").listview("refresh");

for (var x = 0; x < votesCollection.length; x++) {
  $("#decButton" + x).button();
  $("#voteText" + x).textinput();
  $("#incButton" + x).button();
}

有人可以帮帮我吗？

Answer 1

由于评论结果是答案我将作出答案：

尝试删除