Javascript 正确地排列html元素？

我有以下html页面：

扩展用户界面
.标题{
右边填充：50px；
}
.价值{
左侧填充：50px；
}
分数：10
有帐
对
不
有房子
对
不
有电话吗
对
不

并非所有值都按顺序显示。我怎样才能正确地将所有值排序

---

谢谢

使用一个简单的表格怎么样

<table>
    <tr>
        <td>Score:</td>
        <td>10</td>
    </tr>
    <tr>
        <td>Has Account:</td>
        <td>
            <select name="" id="">
                <option value="">Yes</option>
                <option value="">No</option>
            </select>
        </td>
    </tr>
    <tr>
        <td>Has House:</td>
        <td>
            <select name="" id="">
                <option value="">Yes</option>
                <option value="">No</option>
            </select>
        </td>
    </tr>
    <tr>
        <td>Has Phone:</td>
        <td>
            <select name="" id="">
                <option value="">Yes</option>
                <option value="">No</option>
            </select>
        </td>
    </tr>
</table>

分数：
10
其账户：
对
不
他家：
对
不
有电话：
对
不

---

您不能为内联元素设置，但内联块适用于您

.header {
    display: inline-block;
    width: 150px;
}

---

工作演示在这里

以下是您必须进行的Css更改

.header{
    padding-right: 50px;
    min-width: 120px;
    display: inline-block;
}
.value{
    padding-left:50px; 
    display: inline-block;
}

---

您正在对内联元素应用填充，这样它就不会复制您的更改。首先，您必须使其

display:inline block

，然后根据您的结构指定宽度

---

Fiddle:

订单的意思是，你是说缩进和定位吗？为什么这么复杂，只需要一个选择器就可以完成？是的，我们也可以用标记选择器实现，但我有意用类来定义，根据他的结构

.header{
    padding-right: 50px;
    min-width: 120px;
    display: inline-block;
}
.value{
    padding-left:50px; 
    display: inline-block;
}