html - CSS - td 中彼此相邻的文本框和复选框

Question

我有一个文本框和一个复选框，我的问题是复选框转到下一行:

<td><div class='allDropdown'><input type='text' class='vendorDropdown' /> <input type='checkbox' class='checkbox' /></div></td>

我试图让它们彼此相邻。

这是我的 CSS:

.allDropdown {
    width: 100%;
}

.allDropdown input[type=text]  {
    float: left;
    width: 150px;
}

.allDropdown input[type=checkbox] {
    float: left;
}

我有一个很长的表，我也在使用 bootstrap，当我尝试减小文本框的大小时，td 变得更小，复选框转到第二行

Answer 1

您可以将文本框定位为绝对文本框，这样它就会贴在您想要的任何一侧

试试这个..

.allDropdown {
    width: 100%;
}

.allDropdown input[type=text]  {
    float: left;
    width: 150px;
}

.allDropdown input[type=checkbox] {
    position:absolute;
    right:<x>px;
    top  :<x>px;
}