css - DIV定位(多个div，不同Z索引)

Question

此问题已发布多次，但我找不到可以帮助我找到解决方案的讨论。 在 #AnotherDiv 移动后，我怎样才能摆脱底部的这个额外空间？ 我也尝试了其他设置，比如使用外部 div(宽度 100%)并将 #content 和 #AnotherDiv 放在里面，然后是 #AnotherDiv 根本不会停留在底部(我使用了 position absolute 和 bottom 0)。我想要的只是让 #AnotherDiv 在页脚 div 的底部对齐。

http://jsfiddle.net/bW7h2/10/

#AnotherDiv {
    position: relative;
    bottom: 200px;
    width: 100%;
    height: 200px;
    z-index: 1;
    background-color: #00FF00;
}

Answer 1

#AnotherDiv 元素使用 margin-top: -200px; 而不是 bottom:200px;。
你的 CSS 中缺少 ;:

LIVE DEMO

#homepage{
    width: 100%;
    height: 100%;
    padding: 0px;
    margin: 0;
}
/* Header, Body, Footer */
#content {
    position: relative;
    width: 900px;
    margin-left: auto;
    margin-right: auto;
    background-color: #0000FF;
    z-index: 1;        /* 1 IS QUITE ENOUGH, SET '0' FOR #AnotherDiv */
}

#data {
    position: relative;
    width: 100%;
    min-height: 500px;
}
#footer {
    height: 200px;
    width: 100%;  /* MISSING ; */
    position: relative;
    background-color: gold;
}

#AnotherDiv {
    position: relative;
    width: 100%;
    height: 200px;
    z-index: 0;
    margin-top: -200px;  /* INSTEAD OF bottom:200px; */
    background-color: #00FF00;
}