指南针/ sass中的嵌套列

我一直在研究指南针，虽然这是一件有趣的事情，玩和使用，有一件事困扰我（除了无法添加填充，因为它破坏网格），我怎么巢列？指南针/ sass中的嵌套列

我希望能够做蓝图所做的事情：像容器一样嵌套容器，我有一个分为两列（17列和7列）的24列页面。在该页面的右侧部分（7列），我想将一些元素分成两个（2列和5列）。

我尝试这样做：

#main 
    +container 

    #main-content 
    +column(17) 
    +box-padding(17, 10px) 
    :margin 
    :right 0 

    #sidebar 
    +column(7, true) 
    +box-padding(7, 10px)

这对主要页面的代码。侧边栏包含了一些标签和输入列表字段

li 
    +container 
    :margin 
    :bottom 5px 

label 
    +column(2) 
    :margin 
    :right 0 

input 
    +column(5, true)

它还挺作品，但检查的萤火李表明，它的宽度实际上是950像素，而不是只是270px，因为它仅仅是7列。我试着用google搜索嵌套列，但我似乎无法在指南针中找到任何示例。我也试过维基和文档无济于事。

来源

2010-05-20 corroded

我认为问题的一部分（也许是整个问题？）是，您已将container mixin应用于li。该mixin将宽度定义为!blueprint_container_size的值，默认值为950px（但可以重写）。删除，你应该没问题。容器是为了描绘整体，而不是整体的部分。

来源

2010-05-20 19:38:06

我实际上已经尝试过它没有容器混入，但这使得它更糟，因为列不再工作。如果有mixin我应该使用，而不是+容器？ – corroded 2010-05-21 06:20:41

'+ container'是在'#main'上使用的正确mixin，但是由于它定义了body的整体宽度，它不属于列表项。你可以更新你的问题，当你从你的'li'中移除mixin时会发生什么？我有点恼火，它不适合你;我知道我以前用过这种方式。 – 2010-05-21 11:01:48

我继续前进，只是使用浮动左和添加宽度到我的标签和输入字段，但即时消息也激怒了列mixin不工作。我很确定我会再次遇到这个问题，所以我会在一段时间内更新我的问题，并提出请求。 – corroded 2010-05-25 08:17:28

指南针/ sass中的嵌套列

回答

相关问题