Html 带有“位置：绝对”的内部按钮将放置在桌子外面

Html:

为什么

div

内的按钮将放置在div的右上角，而

td

内的按钮将放置在表外

如何修复它

---

请参阅活动演示：

我认为这与

td

的显示样式有关，即

表格单元格

。如果将其设置为

display:block

，它将正常工作

只需在.container样式中添加

display:block

---

正如freewind所指出的，如果td浏览器支持使用

内联块，则最好使用
内联块，因为td通常显示在一行中。
给出元素
位置：绝对相对于其包含的块放置它。由于表单元不被视为块容器（与
div
不同），因此它相对于文档体本身放置它<代码>顶部：3px
从文档的上边框将其带出3px，并且
右侧：3px将其从右边框移动3倍

对于
td
，
内联块
更好，因为
块
将使
td
保持整行。
<br/><br/><br/><br/><br/>

<table>
<tr>
    <td class="container">
        <button class="del">delete</button>
    </td>
</tr>
</table>

<br/><br/><br/><br/><br/>

<div class="container">
<button class="del">delete</button>
</div>​

.container {
    position: relative;
    border: 1px solid red;
    height: 50px;
    width: 200px;
}

.del {
    position: absolute;
    top: 3px;
    right: 3px;
}​