有没有像min-height这样的css属性,但是对于top？在下面的例子中,当我隐藏div1(通过javascript),我希望div2有顶部:50.否则,要放在div1下面.
<html>
<head>
<style>
#div1
{
height:100px;
}
#div2{
//min-top:50px;
}
</style>
</head>
<body>
<div id='div1'>This div may be hidden</div>
<div id='div2'>This div must not be placed above 50px</div>
</body>
</html>
编辑:我在下面回答
当div1未被隐藏时,我希望div2正好在div1之下.想象div1是一个树视图,可以有任何高度(甚至可以隐藏)和div2作为段落,应始终低于50px
“CSS 有 min-top 属性吗？” 不是，但 ...
...你可以像min-top一样使用math函数来生效：
<style>
#div2{
top:max(50px, 10%);
}
</style>
https://developer.mozilla.org/en-US/docs/Web/CSS/max
我想出了一种利用top：0 bottom：0 hack的解决方案。
我们创建一个容器，该容器的高度是其相对父容器的高度（如果有的话）-然后我们给它一个最小高度（例如，您的最小顶部）
然后，我们将实际元素绝对定位在此容器的底部。
CSS：
.container {
position:absolute;
bottom:0px;
top: 0;
min-height: 700px; //Adjust this to your MINIMUM (eg your min-top)
}
.position-me {
position: absolute;
bottom: 0;
}
HTML：
<div class="container">
<div class="position-me">Great!</div>
</div>
我看到这个问题还有很多人在评论，也有很多人在评论。由于这个问题还没有完全回答，我决定在这里写下完整的答案：
适当的CSS：
#div1 {
min-height:50px;
background-color: #fee;
margin-bottom:-50px;
}
#div2 {
margin-top:50px;
background-color: #efe
}
http://jsfiddle.net/vVsAn/5051/
结果
| 归档时间： |
|
| 查看次数： |
48830 次 |
| 最近记录： |