隔離模式 - 清除並創建一個新的行

Question

好的 - 我讀過約翰阿爾賓威爾金斯http://palantir.net/blog/responsive-design-s-dirty-little-secret - 我現在明白'隔離'模式的動機（以及它的實現方式）。

我然後讀山姆的隔離模式初步反駁，但他更新了他的職務說，他來了'輪的想法（或者說至少他明白它的動機） - http://snugug.com/musings/on-responsive-designs-dirty-little-secret

如果我我們已經正確理解了所有這些，Singularity對Zen網格的一個改進就是它允許您混合輸出樣式（例如，您可以使用@import佈局mixin在佈局中間切換到浮動輸出）。

然而，在隔離模式 - 我還沒有你如何「清除行」明確 - 約翰·阿爾濱威爾金斯在他的帖子中提到...

雖然浮動這一技術項目的不能再看到彼此的右邊緣，清理時仍然可以看到它們的底邊。這意味着您可以通過簡單地清除之前的網格項目來開始一排新的網格項目，並且該新的一行將位於以前的所有內容之下。

比方說，我有一個部分，裏面有6篇文章 - 我希望所有文章佔據該部分中兩列網格的1列。

grid-span(1,1) 
grid-span(1,2) 
/* next row */ 
grid-span(1,1) 
grid-span(1,2) 
/* next row */ 
grid-span(1,1) 
grid-span(1,2) 

也許我沉迷與行清算了一下，雖然我承認，在一個浮動輸出發生這種情況「自然」，並與山姆揪着它在自己的崗位，並與沒有後準確描述'如何在不使用clearfix容器的情況下以隔離模式清除該行，我的好奇心被激怒了。

Answer 1

要清除一行，請在該行的第一個項目上使用clear: both。

注意奇異隔離跨度混入適用clear: right，讓你有跨度混合料攪拌後以應用clear: both：

.foo 
    +grid-span(1, 1) 

.bar 
    +grid-span(1, 2) 

.baz 
    +grid-span(1, 1) 
    clear: both 

.quux 
    +grid-span(1, 2) 

有關結算的更多背景信息，請閱讀這樣的回答：Layout using Singularity