青いボックスの上に、青いボックスと同じ寸法の DIV を配置したい :D
青いボックスを相対にすることで可能であることがわかっています.DIVをその中に配置し、絶対位置を0,0にします。
しかし、青いボックスの CSS を変更したり、その中に配置したりせずにこれを行う方法はありますか?
文書本文の最後にある DIV が必要です。
青いボックスの上に、青いボックスと同じ寸法の DIV を配置したい :D
青いボックスを相対にすることで可能であることがわかっています.DIVをその中に配置し、絶対位置を0,0にします。
しかし、青いボックスの CSS を変更したり、その中に配置したりせずにこれを行う方法はありますか?
文書本文の最後にある DIV が必要です。
div.blue-box {
...stuff here...
}
div.other-blue-box {
position: absolute;
z-index: 1; /* z-index must be greater than the z-index of div.blue-box */
top: <location of the div.blue-box>; /* must correspond with the top position of the div.blue-box */
left: <location of the div.blue-box>; /* must correspond with the left position of the div.blue-box */
}
position : absolute
newに設定するdiv
と、ページ上の他の要素に関係なく、指定した場所に移動します。は、元の青いボックスの上z-index
に配置されるようにします。新しい青いボックスを DOM のどこに配置しても、絶対位置があり、ゼータ インデックスが他の要素よりも大きい限り問題ありません。
CSS を変更せずに div の配置を変更する方法はありません。ポジショニングをスクラッチして、フロートとクリアを試してください。