html - 如何将 div 保持在最大宽度内并始终位于顶部

Question

我不完全确定如何用技术术语描述我的问题，但我不确定如何执行它。我有一个要放置在页面上的 div。它应该保留在另一个具有最大宽度的 div 中。所以当浏览器窗口增加时，一个div中的这个div永远不会超出另一个div的max-width。

但是，当您减小浏览器窗口的大小时，我不希望隐藏此 div。我希望它保持在所有内容之上，并与浏览器窗口的边缘对齐。

那有意义吗？我有一张图片：

深色矩形不会超出某个最大宽度。当浏览器较小时，它会向上推到浏览器边缘并始终保持可见。

我该怎么做呢？提前致谢。

Answer 1

HTML

<div class="main">
  <div class="Parent">
  </div>
</div>

CSS

.Parent{
  width:200px;
 height:100px;
 background:red;
 position:absolute;
 right:0;
top:200px;
}
.main{
  width:700px;
  margin:auto;
  height:1000px;
  background:blue;

}

​演示

Answer 2

尝试这样的事情：

http://jsfiddle.net/Mk9KV/