为什么我的CSS没有应用保证金?

时间:2018-03-30 17:37:44

标签: html css

我有一个div:

.divcom {
    background-color: lime;
    border-radius: 5px;
    width: 37.5%;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.39), 0 6px 20px 0 rgba(0, 0, 0, 0.39);
}

我希望它在页面结束前在底部有一些空间(让我们说50%)

当我尝试bottom: 50%margin-bottom: 50%时,它不起作用(颜色消失)。

我也尝试将margin-bottom: 50%放入体内,但没有帮助。

2 个答案:

答案 0 :(得分:3)

绝对定位的元素不在正常的文档流程中。它们应该谨慎使用,因为它们使布局更复杂。您的元素可能有边距,但不会影响页面上的其他元素,因为它是单独分层的。

我还要指出bottommargin-bottom是非常不同的东西,百分比边距可能会很麻烦(你并不总是知道你所占的比例是多少)。

有关更具体的建议,请提供更具体的用例。

答案 1 :(得分:0)

尝试将margin-bottom设置为auto并将bottom设置为10px。由于top被设置为100%

,我无法真正告诉您尝试了什么