Html 显示：内联isn'；t使元素显示在一行上

我有一个带有“标准表”类的表。当我将输入框、选择项或文本区域与另一个元素组合到一个单元格中时，它们会显示在两个单独的行上，即使没有任何
出现

下面是该类的CSS：

/* Table
====================================*/
table.standard-table {
    width:100%;
    border-collapse: separate;
    border-spacing: 0;
    border:none;
    margin-bottom: 15px;
    -webkit-box-shadow:  0px 1px 1px 0px rgba(180, 180, 180, 0.1);
    box-shadow:  0px 1px 1px 0px rgba(180, 180, 180, 0.1);
    border:1px solid #cccccc;
}

table.standard-table th {
    border: 1px solid #dddddd;
    border-right: none;
    background-color: #fafafa;
    text-align: left;
    padding: 10px 15px;
    color: #404040;
    vertical-align: top;
    font-size: 14px;
    font-weight: bold;
}

table.standard-table td:last-child {
    border-right: 1px solid #ddd;
}

table.standard-table th:last-child {
    border-right: 1px solid #ddd;
}

table.standard-table td {
    padding: 10px 15px;
    border: #e0e0e0 1px solid;
    border-top: none;
    border-right: none;
}

table.standard-table tr:hover td {background-color: #fafafa;}

table tr.altrow { background-color: #cccccc; }

table th {text-align: left; font-weight:bold; vertical-align:top; }

下面是一个有问题的行的示例：

<tr>
    <th valign='top'>Items in Package</th>
    <td>
    <input type='checkbox' name='categories[]' value='test' /> Test 
        <input type='text' name='budget_1' placeholder='Budget' style='width:200px;' onkeyup=\"if (/[a-z\s,$]/ig.test(this.value)) this.value = this.value.replace(/[a-z\s,$]/ig,'')\" />
    </td>
</tr>

包装中的物品
试验

我尝试过添加“显示：内联”、“显示：内联单元格”、“显示：内联表格”和所有其他内容，但没有将复选框、文本和输入框放在同一行上。

尝试

float: left;

这将强制元素内联。除此之外，使用

table-layout: fixed;

---

您可以使用

垂直对齐

---

其技术上已经垂直于中间对齐，但我不认为视觉上看起来不是这样。

我在标签上加上“style =浮点：左”，它缩短了单元格的宽度。您可以在jsfiddle.net上设置一个演示，保存它并在这里发布链接。让我知道你的预期结果。我会处理它。您的表的宽度是否足够，可以将这些元素放在同一行？我感觉好像您有一些代码正在修改复选框。请创建一个小提琴或向我们展示您的问题所在的屏幕截图。