我正在制作一个简单的博客主题,我想要一个小框显示每个帖子的左偏移量的帖子日期,如下所示:http ://s21.postimg.org/fjygwqw1z/timestamp_Mockup.png
但是,帖子的容器有一个溢出-y 设置为滚动,并且将时间戳 div 附加到每个帖子不会显示,因为它被溢出隐藏了。如果我将时间戳 div 设置为 position: absolute,我可以解决这个问题,但它不会与帖子保持一致,而是固定在一个地方。
这是一个简单的例子:http: //jsfiddle.net/MeVwt/
<style>
#leftCol{
width: 100px;
height: 500px;
background: green;
float: left;
}
#rightCol{
width: 400px;
height: 500px;
background: orange;
overflow-y: scroll;
float: left;
}
.content{
height: 700px;
width: 100%;
background: red;
}
.box{
width: 100px;
height: 100px;
background: purple;
margin-left: -50px;
}
</style>
<div id="leftCol">
</div>
<div id="rightCol">
<div class="content">
<div class="box"></div>
Fish
</div>
</div>
我想要做的是让紫色框(.box)显示在其容器(.content)之外并出现在绿色区域而不将其设置为固定位置,因此它仍会随内容滚动。