Sass div不能使用susy栅格垂直展开_Sass_Grid Layout

Sass div不能使用susy栅格垂直展开

sass

Sass div不能使用susy栅格垂直展开,sass,grid-layout,Sass,Grid Layout,好吧，我已经搜索了很多，但是我现在没有选择了，没有霍格沃茨的学位，我想不出来。首先，我知道当一个主包装器div中有内容的div，并且它们不想扩展到父容器的高度时，这是一个常见的排版问题。我有一个简单的例子可以使用——白色和黄色div与主容器（背景绿色）一起正确扩展然而，我目前正在使用Compass和Susy for grids为我的博客页面开发Jekyll 2列模板。事情变得越来越复杂我的html： <body> <div id="root" role="mainwra

好吧，我已经搜索了很多，但是我现在没有选择了，没有霍格沃茨的学位，我想不出来。首先，我知道当一个主包装器div中有内容的div，并且它们不想扩展到父容器的高度时，这是一个常见的排版问题。我有一个简单的例子可以使用——白色和黄色div与主容器（背景绿色）一起正确扩展

然而，我目前正在使用Compass和Susy for grids为我的博客页面开发Jekyll 2列模板。事情变得越来越复杂

我的html：

<body>
<div id="root" role="mainwrapper" class="container">
    <div role="sidecontent" class="sidebar">
    nawigacja jakas
    <ul>
        <li>a</li>
        <li>b</li>
        <li>c</li>
    </ul>
</div>

<div role="zawartosc" class="main">

cos cos cos cos
</div>
</div>
</body>

我知道我确实遗漏了一些东西，但我的朋友都没有帮到我：（

在CSS中获得

100%

高度可能非常棘手和不可靠，但我想我找到了两个示例之间的实际差异（不是Compass或Susy）。不起作用的示例缺少

高度：100%；

html、

正文

、和

容器

元素上的设置。添加这些元素，它就会起作用。

我后来也发现了。看起来主要问题是div元素既有id又有类，并且存在某种冲突和css优先级问题。谢谢

$legacy-support-for-ie6 : false;
$legacy-support-for-ie7 : false;

// Podstawowa typografia
$total-columns: 12;
$gutter-width: 1em;
$column-widht: 5em;
$grid-padding: $gutter-width;

$development:true; 
$border-box-sizing:true;
$max-width: 1200px;

@import "susy";


[class^="container"]  {
    @include container;
    overflow:hidden;
    @include susy-grid-background;
    @include box-sizing(border-box);
}
[class^="sidebar"]{
    @include span-columns(3,12);
    min-height:100%;
    @include box-sizing(border-box);
}
[class^="main"]{
    @include span-columns(9 omega,12);
    min-height:100%;
    @include box-sizing(border-box);
}