这是 float 和 fixed 的标准用法:
<html>
<head>
<style type="text/css">
#bigDiv
{
background-color: red;
height: 2000px;
width: 100px;
float: left;
}
#littleDiv
{
background-color: green;
height: 400px;
width: 200px;
float: left;
}
#littleDivFixed
{
background-color: blue;
height: 100px;
width: 200px;
position: fixed;
}
</style>
</head>
<body>
<div id="bigDiv">
</div>
<div id="littleDiv">
</div>
<div id="littleDivFixed">
</div>
</body>
</html>
_
- “littleDiv”div 在“bigDiv”div 的右侧，但不跟随滚动，
- 相反，“littleDivFixed”div 会滚动，但相对于“bigDiv”div 而言位置不佳(它始终停留在显示的左侧)。
_
是否有可能混合两种行为的 div :
- 始终在“bigDiv”div 的右侧(以 10px 的恒定距离)，
- 始终在显示屏上(与顶部保持 10 像素的恒定距离)？
_
预先感谢您的帮助。
最佳答案
你能改变标记的结构吗？
通过进行两项更改，我获得了您描述的行为(在 Firefox 3.6 中):
在 littleDiv 中嵌套 littleDivFixed
所以代替
<div id="littleDiv">
</div>
<div id="littleDivFixed">
</div>
你有
<div id="littleDiv">
<div id="littleDivFixed">
</div>
</div>
为固定div添加边距
margin-left: 10px;
设置 margin 而不是 left 可以让您保持“自动”左定位，同时仍然进行相对调整。
关于css - 混合 float 和固定定位，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/4751273/