在动态变化的DIV下方直接显示一个DIV

时间:2013-07-31 12:03:20

标签: css html5

我有一个DIV,根据用户输入的数据改变高度。完成后,他们点击一个按钮,下面会出现第二个DIV,所有数据都显示在表格中。 第二个DIV始终在页面上,但它的不透明度设置为0。

由于第一个DIV的高度可以是100px到1000px,我怎样才能让第二个DIV始终直接显示在它下面?我一直在玩边缘和填充,但我不能让第二个DIV动态出现在正确的位置。

最好使用CSS,如果那是一个选项。

感谢。

2 个答案:

答案 0 :(得分:1)

如果div是(默认值),它将显示在第一个div的底部

<div class="firstDiv"></div>
<div class="secondDiv"></div>

如果你想要第二个div重叠第一个div并通过滚动移动你应该使用CSS位置属性

.secondDiv{
    position:fixed;
    right:0;
    bottom:0;
}

答案 1 :(得分:1)

您必须确保在div中将CSS 位置属性设置为 relative 。类似的东西:

HTML:

<div class="user_input_data"></div>
<div class="results hidden"></div>

CSS:

div.user_input_data
{
    position: relative;
}
div.results
{
    position: relative;
}
div.hidden
{
    display: none;
}
div.block
{
    display: block;
}

然后你必须删除隐藏的类并添加 block 类来显示你的结果。