我试图在相对容器内创建固定位置div.我正在使用bootstrap css框架.我试图创建一个固定的位置推车.所以每当用户滚动页面时,它将显示购物车内容.但现在的问题是,它运行在容器div之外.
这必须在响应模式下工作.
在这里我的尝试：
<div class="wrapper">
<div class="container">
<div class="element">
fixed
</div>
</div>
</div>
CSS代码：
.wrapper {
width:100%
}
.container {
width:300px;
margin:0 auto;
height:500px;
background:#ccc;
}
.element {
background:#f2f2f2;
position:fixed;
width:50px;
height:70px;
top:50px;
right:0px;
border:1px solid #d6d6d6;
}
解决方法
截图：
这是如何位置：固定;表现：
Do not leave space for the element. Instead,position it at a
specified position relative to the screen’s viewport and doesn’t move
when scrolled. When printing,position it at that fixed position on
every page.
因此,要得到你想要的东西,你必须使用比固定定位更多的东西：
可能这个：demo
.wrapper {
width:100%
}
.container {
width:300px;
margin:0 auto;
height:500px;
background:#ccc;
}
.element {
background:#f2f2f2;
position:fixed;
width:50px;
height:70px;
margin-left:250px;
border:0px solid #d6d6d6;
}
