css - DIV の配置 (複数の div、異なる Z インデックス)

Question

この質問は何度も投稿されていますが、解決策を見つけるのに役立つディスカッションが 1 つも見つかりません。が移動した後、下部にあるこの余分なスペースを取り除くにはどうすればよい#AnotherDivですか? #content外側のdiv（幅100％）を使用してandを#AnotherDiv内側に配置するなど、他のセットアップも試し#AnotherDivましたが、底にまったく留まりません（position absoluteand bottom0を使用しました）。私が望むのは#AnotherDiv、フッター div の下部に配置することだけです。

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

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

Answer 1

margin-top: -200px;要素の代わりに使用bottom:200px;します#AnotherDiv。そして、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;
}

Answer 2

あなたのコメントから私が理解しているのは、あなたがこれをしたいということですか？

#AnotherDiv {
    position: fixed;
    bottom: 0px;
    width: 100%;
    left: 0;
    right: 0;
    height: 20px;
    z-index: 101;
    background-color: #00FF00;
}