Javascript jQueryUI：垂直对齐菜单行的html元素

我有一个jQueryUI菜单，有几行，每行都有完全相同类型的元素。即：

  <ul id="menu1">
        <li id="row1"><span id="row1-1">Row1</span><input id="row1-2"><span id="row1-3">blah</span></li>
        <li id="row2"><span id="row2-1">Row Two</span><input id="row2-2"><span id="row2-3">blah2</span></li>
  </ul>
  <script>
  $('#menu1').menu()
  </script>

Row1blah
第二行blah2

$（'#menu1'）。菜单（）

我希望垂直对齐每种相同类型的元素，以便文本“Row1”与“row2”垂直对齐，然后

与

垂直对齐，等等

我该怎么做

---

以下是jsbin:

出于可访问性等原因，正确的方法是使用标签标签并为其指定宽度：

标签{宽度：100px；显示：内联块；}


第1行
废话


第二排
废话

非常感谢！！我是网页设计新手：）

<style>
label {width: 100px; display: inline-block;}
</style>

<ul id="menu1">
    <li id="row1">
        <label for="row1-2" id="row1-1">Row1</label>
        <input id="row1-2" />
        <span id="row1-3">blah</span>
    </li>

    <li id="row2">
        <label for="row2-2" id="row2-1">Row Two</label>
        <input id="row2-2" />
        <span id="row2-3">blah2</span>
    </li>
</ul>