如何在HTML的同一行上包含輸入和標簽？

Question

我有一個通過AJAX / JQuery追加到表的表行。 該行應該有一些描述什么是“類別”的文本，然后有兩個按鈕（輸入標簽），當單擊它們時它們將執行特定的操作。 除了我無法以所需的方式格式化文本外，它是可行的。 我希望按鈕和文本在行的同一行上，並且文本在左側。

如果我將文本放在中，那么它將創建自己的行，並且按鈕將顯示在標簽下方。 如果我將文本放在a中，則所有內容都在同一行上，但是文本在按鈕的右側而不是左側。 我還嘗試了許多樣式技術，例如顯示：內聯塊和垂直對齊：最重要的是無濟於事。

$('#listOptionsTable').append('< tr >< td >' + '<text>' + result.Value + '</text>' + "< input type='button' class='btn' id='addButton' onclick='addPopulateCategoryTable(" + result.SpecListOptionID + ")' value='Add To Category(s)' />" + "< input type='button' class='btn' id='deleteButton' onclick='deletePopulateCategoryTable(" + result.SpecListOptionID + ")' value='Delete From Category(s)' />" + '< /td >< /tr >');

我如何才能使它們全部位於同一行上，而文本在左側，緊隨其后的是兩個按鈕？

編輯：這是我的表與CSS定義。 這是一個非常簡單的表，沒有什么花哨的：

< table id="listOptionsTable" style="background-color:#F0F0F0;" >< /table >

Answer 1

TD細胞將折疊並盡可能包住其中的所有內容。

為了防止這種情況，請使用CSS在TD標簽上設置寬度：

<style>
#listOptionsTable td {width: 300px}
</style>

或者您想要的任何寬度。 否則，寬度將是自動的，並且會在導致對象包裹時按其認為合適的方向縮小。