【发布时间】：2015-03-27 18:40:58
【问题描述】：
我正在尝试生成这样的布局：
蓝色是顶部标题，红色是底部标题，绿色是菜单，白色底部是正文。白色圆圈是我尝试放置的徽标，使其与标题部分重叠，但不与菜单部分重叠。
按照Singularity Grid layout with header and footer width 100% 中的建议，我在内容部分设置了 div 包装器，并让全宽背景颜色正常工作。
我还使用 div 包装器将标题和菜单区域定位到屏幕中间的固定宽度位置（由黑色垂直线表示）。
最后，我将标题区域设置为仅占据网格的一部分 (9,4)，并将徽标设置为仅占据网格的一部分 (3,1)。
不幸的是，我不确定如何将徽标与网格部分对齐并保持全宽颜色背景。如果我设置 div 的方式与我想要做的不一致，我也不会感到惊讶。
有什么建议或提示吗？
我已经建立了一个 Sassmeister 示例。实际站点是在 drupal 中完成的，但演示是从头开始完成的，希望使其更具可读性。 http://sassmeister.com/gist/7163c32a080a446f20ff
【问题讨论】：
标签： css sass singularitygs