html - 父 div 之外的容器 div

Question

我似乎无法弄清楚为什么我的 project-img-text-container 落在其父 div project-image-container 和 之外元素 img-main。我添加了 project-image-container 来解决这个问题，但它什么也没做，我画的是一片空白。我将两个容器都设置为相对的，所以不确定为什么 project-img-text-container 在设置为 absolute 时会掉出来。

有人知道为什么吗？

#project-img-main {
	position: relative;
	margin: 0;
	width: 100%;
	height: auto;
}
#project-image-container {
	width: 100%;
	height: 100%;
	position: relative;
}
#project-img-window {
	max-height: 700px;
	/*background: rgba(0,0,0,0);*/
	width: 100%;
}
#project-img-text-container {
	background: rgba(0,0,0,.7);
	position: absolute;
	width: 33%;
	height: 100%;
	left: 60%;
	z-index: 99;
}
#project-img-text {
	color: #FFF;
	font-size: 2em;

}

	<div id="project-img-main">
		<div id="project-image-container"><img src="http://optimumwebdesigns.com/eslich/images/projects/project-main3.jpg" id="project-img-window" alt="Demolition and Wrecking Projects">
			<div id="project-img-text-container">
				<div id="project-img-text">Test</div>
			</div>
		</div>	
	</div>

Answer 1

#project-img-text-container {
    top:0;
}

将某物设置为绝对位置时，您需要指定它在文档或包含元素中的位置。