Mobile 将同一行上的JQuery移动元素与网格对齐

我有五个HTML元素与jquery mobile水平对齐。我使用宽度可变的5列自定义网格（

ui-grid-d

）。一切正常，但元素没有完全对齐-例如，控制组位于上方，段落位于其他组件下方

我对手机设计和jQuery手机还很陌生。有没有办法自动对齐所有元素

<div id="alarmsLog" class="ui-grid-d">
      <div class="ui-bar ui-bar-c">
          <div class="ui-block-a">
            <a href="#" data-role="button" data-icon="delete" data-iconpos="notext">Image</a>
          </div>
          <div class="ui-block-b">
            <div data-role="controlgroup" data-type="horizontal" >
                <a href="#" data-role="button" data-icon="arrow-l" data-iconpos="notext">Left</a>
                <a href="#" data-role="button" data-icon="arrow-r" data-iconpos="notext">Right</a>
            </div>
          </div>
          <div class="ui-block-c">
            <p>1 di 2</p>
          </div>
          <div class="ui-block-d">
            <input type="text" name="alarmText" id="alarmText" value="Allarme 1"  />
          </div>
          <div class="ui-block-e">
            <a href="#" data-role="button" data-icon="delete" data-iconpos="notext">Delete</a>
          </div>
      </div>
</div>

1第2部分

您似乎只是想将元素居中？不确定为什么要使用javascript。您不能使用一些css，例如.ui-grid-d{width:300px；margin:0 auto；text align:center；}​不，它们没有水平对齐。