在CSS中嵌套的边框布局？

我有这个工作正常：http://jsfiddle.net/uwcEw/ - 一个传统的CSS边框布局。在CSS中嵌套的边框布局？

我想要做的是在边界布局的“中间”有另一个5区域的边界布局。从上面重新应用相同的模式我得到这个：http://jsfiddle.net/6bked/4/（编辑链接），它不工作，显然它不是相对于它的父容器，但我不知道如何解决这个问题，所以我可以应用这个模式在嵌套的上下文中需要。

任何帮助？另外如果有更好的方法来做到这一点（Compass + Sass/blueprint/js布局），我愿意提供建议。

UPDATE

我也想搞清楚我只关心在现代浏览器（WebKit的，FF）主要关心的Webkit这个工作，我不担心没有启用javascript

谁也用户

来源

2011-05-28 user445994

究竟是你想要的...... – Anish 2011-05-28 02:46:30

我想做一个嵌套在另一个边界布局的“中间”区域的边框布局 – user445994 2011-05-28 02:52:04

我并不完全是固定布局的最大粉丝，但如果我理解正确，这应该是你想要做的：http://jsfiddle.net/8Cq9A/。

尺寸是相对于浏览器窗口，甚至是嵌套集div的。你需要做什么来修正你的布局是调整你的内在尺寸考虑到这一点。例如，如果您的外部左右侧div的宽度设置为10％（意味着浏览器窗口宽度的10％）将中心div分成2等分，您可以将它们的每个宽度设置为：（100％-10％-10％）/ 2 = 40％。

就我个人而言，我会考虑使用浮动：http://jsfiddle.net/Sf8Kp/。尽管如此，你会遇到的问题是如果你想要链接中看到的高度相等的列。

还有很多漂浮在如何解决这个问题的文章。一些好的阅读已经有一段时间了：alistapart（1,2），positioniseverything。左右搜索人造色谱柱和3柱[液体|弹性|等高]布局。

来源

2011-05-28 02:53:29 anomareh

为了更好地解释这个答案，使用'position：fixed'的问题是：位置是相对于浏览器窗口设置的，而不是包含元素。设置你的内部元素的位置需要你考虑到这一点。 – Wex 2011-05-28 03:13:52

所以，是的，告诫@ anomareh的答案是，我需要固定的高度和宽度不是百分比，谢谢@Wex澄清 - 所以基本上我需要在运行时使用JavaScript或使用js布局库计算这个？ – user445994 2011-05-28 03:25:54

@ user445994没有维度仍然是相对的，只是相对于浏览器窗口。所以对于嵌套的div，它仍然有相对的尺寸，它们只是相对于父浏览器的浏览器，并依次进行调整。我会更新答案以更好地解释。 – anomareh 2011-05-28 03:49:22

在CSS中嵌套的边框布局？

回答

相关问题