带有溢出的基于平铺的布局答案

【问题标题】：Tile based layout with overflow带有溢出的基于平铺的布局
【发布时间】：2012-12-11 08:12:34
【问题描述】：

我想为游戏显示基于图块的地图。我目前的方法是拥有一个固定大小的 div 并将绝对定位的较小 div 放置到该外部 div 中。如果地图上给定坐标有东西，我会在该位置设置 div 的背景图片。（见http://dungeonpilot.com）

现在我不希望外部 div 的大小是固定的。我希望内部 div 使用整个浏览器空间。我想我可以通过将宽度和高度设置为 100% 来实现这一点。但是，如果我将浏览器窗口变小，以至于某些内部图块不再可见，我希望看到滚动条。但不知何故，将外部 div 的溢出设置为 auto 和文档正文都没有解决问题。

我必须在哪里以及如何设置溢出属性才能获得预期的行为？

【问题讨论】：

【解决方案1】：

找到了解决办法！申请

溢出：滚动；

到#masters_view 和#party_view div。告诉我它是否有效。

【讨论】：

不幸的是，这对我不起作用；既不是在 Safari 中，也不是在 Firefox 中。但这是我最初尝试过的。 url 只是一个示例，两个示例地下城都有固定大小的 div。我现在要设计的地牢视图是一个，当越来越多的地牢被揭露时，尺寸会变大。如果显示的地牢超出了包含的浏览器窗口，我希望有“原生”滚动条。
您能发送实时预览吗？也许codepen.io？您可以尝试地牢元素的 min-width，但我不太了解使用的编码...
我把它归结为jsfiddle.net/VyQYx 似乎外部 div 中的 'position:relative;' 是问题所在。我真的很难理解这个 CSS 混乱 ;-)
我正在使用 chrome 和 biv 滚动都是......也许是浏览器错误或者我不明白这个问题，你想让 .dungeon-canvas-full-screen div 滚动不是吗？
这个例子现在可以工作了。但它与我的第一个版本不同（不起作用），因为它有“位置：相对”行，这似乎是它不起作用的原因。