如何使用其中的 div 调整固定 div/nav 的大小？答案

【问题标题】：How to make a fixed div/nav resize with the div it's inside of?如何使用其中的 div 调整固定 div/nav 的大小？
【发布时间】：2014-07-31 01:27:00
【问题描述】：

我对 Web 开发很陌生，无法弄清楚这一点。感谢任何帮助！

在重新调整大小时，固定 div 会移出容器而不是重新调整大小。我正在处理的网站将导航作为固定部分，并且位于主容器内。

感谢任何帮助。谢谢！

<div class="container">
<div class="fixed"></div>
</div>

.container {
  border: 1px solid;
  max-width: 600px;
  width: 100%;
  min-height: 1600px;
}

.fixed {
  max-width: 600px;
  width: 100%;
  height: 50px;
  border: 1px solid green;
  position: fixed;
}

http://jsfiddle.net/KqvQr/

【问题讨论】：

问题是 max-width 属性覆盖了 width 属性，但是 min-width 总是会覆盖 max-width 无论是在声明中的宽度之前还是之后

标签： javascript jquery html css fixed

【解决方案1】：

当您将位置指定为 fixed 元素时，即使它在父容器内，它也不会表现为父容器的子容器。它不会根据父宽度调整他的宽度。但是我可以给你一个解决方案，当用户调整页面大小时，固定的 元素也会调整大小，但它的位置是固定的

.fixed {
   height: 50px;
   border: 1px solid green;
   position: fixed;
   right:0;
   left:0;
}

不要指定容器的宽度。而不是指定 left 和 right 值。所以当页面调整css大小时，只检查左右边距值。通过保持这些值，它将始终调整其内部宽度。

这是工作小提琴http://jsfiddle.net/KqvQr/5/

【讨论】：

【解决方案2】：

如果你坚持这些限制，我认为你无法实现你想要的。如果您将职位更改为 relative 而不是 fixed..

，您的 width 和 max-width 将按预期工作

看看这个小提琴

【讨论】：