html - 多个复选框对齐

Question

我想修复多个复选框的位置。我想要坐标 X=340 Y=250 处的第一个复选框。

HTML：

<div class="checkboxes">Select which contacts to display :
    <table>
        <tr>
            <td data-bind="foreach: viewModel.mailAddresses() ">
                <label for="CheckBoxOne">
                    <input id="CheckBoxOne" type="checkbox" data-bind="attr: { value: $data }, checked: viewModel.ui.CheckedEmails" /> <span data-bind="text: $data"></span>
                </label>
            </td>
        </tr>
        <tr>
            <td data-bind="foreach: viewModel.ui.Options() ">
                <label for="CheckBoxTwo">
                    <input id="CheckBoxTwo" type="checkbox" data-bind="attr: { value: $data }, checked: viewModel.ui.CheckedOptions" /> <span data-bind="text: $data"></span>
                </label>
            </td>
        </tr>
    </table>
</div>

CSS 代码

.checkboxes label {
    display: block;
    float: left;
    padding-right: 10px;
    white-space: nowrap;
}
.checkboxes input {
    vertical-align: middle;
}
.checkboxes label span {
    text-align:center;
    vertical-align: middle;
}

没有与选择消息垂直对齐的屏幕截图：

我正在寻找的屏幕截图：

Answer 1

您可以对精确坐标使用绝对定位：

position:absolute;
left:340px;
top:250px;

请注意，绝对定位不是可靠的跨浏览器。