如何在表格布局中将div放在另一个div的顶部？

时间：2011-07-12 17:33:49

标签： html css

我有一个如下所示的布局：

这是一张桌子，顶部有一个单元格，下面有三个单元格。 三个单元格为150px，auto，200px。

在中间单元格中，我有一个包含日历的div。我希望能够在此处添加另一个具有不透明度的div，以便“模糊”它并使其在处理Ajax请求时无法使用。

我尝试使用

设置opacity-div的样式 
position: absolute;
margin-left:150px;
margin-right:200px;
width:100%

但事实证明width 100%占整个屏幕的100％，而不仅仅是那个细胞。

我已经尝试将div放在代码中的日历div下面并使用以下方式设置样式：

position: relative;
top: -100%;
height: auto;

但这似乎根本不起作用，因为我无法知道日历的高度，所以我无法确定高度以及我应该将它移动多少。

1 个答案:

答案 0 :(得分：7)

您需要将容器div放在可模糊单元格内，围绕单元格的内容。

<tr>
  <td>...</td>
  <td>
    <div style="position: relative">
        <div id="calendar">...</div>
        <div id="blur"></div>
    </div></td>
etc...

通过这种方式，您可以保证绝对定位将相对于此容器div进行，而不是树上相对较远的任何元素（很可能是<body>或<html>）。

相关问题
最新问题