我试图把蓝色方格div的角落放在橙色div下面.我尝试了所有我知道的东西:
z-index不起作用,因为我的div被包裹在另一个div中,如果我打开它,我会遇到定位八个元素的麻烦.
谁能告诉我怎么做?或者如何对所有元素使用z-index?
是)我有的:

我需要的:

到目前为止我的HTML:
body {
background-color: #222;
background-repeat: no-repeat;
}
#blueSquare {
position: absolute;
left: 15px;
top: 15px;
width: 50%;
height: 170px;
-webkit-transform: rotate(-45deg);
}
#rightTopblueSquare {
height: 100%;
width: 50%;
position: relative;
left: 50%;
background-color: #7ab9c2;
opacity: .99;
}
#leftBottomblueSquare {
position: relative;
top: -100%;
height: 100%;
width: 50%;
background-color: #6baaae;
}
/*----------------------------------*/
#greySquare {
width: 50%;
height: 170px;
position: absolute;
bottom: 15px;
left: 15px;
-webkit-transform: rotate(45deg);
}
#lefTopgreySquare {
height: 100%;
width: 50%;
position: …Run Code Online (Sandbox Code Playgroud)