2013-04-07 1 views
0

다른 열 안에 기사 열 (2 열)이 있다고 가정 해 봅시다. 명시 적으로 기사가 있어야하는 열에 특이성을 알릴 필요없이이를 달성하는 가장 좋은 방법은 무엇입니까?Singularity가있는 최소 마크 업으로 다중 열 그리드를 만드는 가장 좋은 방법은 무엇입니까

의사 클래스로 선언하는 유일한 방법입니까?

article:nth-child(1n){ 
    @include grid-span(1,1); 
} 
article:nth-child(2n){ 
    @include grid-span(1,2); 
} 

감사합니다.

답변

6

일명 user2242314 위에서 :: 불행하게도

$grids: 12; 
$gutters: 1/3; 

.column { 
    @include float-span(1); 

    &:last-child { 
    @include float-span(1, 'last'); }} 

제안했다 스콧보다 더 짧은 방법이, 특이점에 버그가있어 그 singularity 문서에있는 suggested이지만이 짧은 방법을 사용하지 못하게합니다.

나는 버그를 수정하고 pull request을 제출했습니다. Scott 또는 Sam (일명 Snugug)이 수락하고 업데이트 된 gem (버전 1.0.7 이상)을 출시 할 때까지 기다립니다. gem update 또는 bundle update을 실행하면 가장 깨끗한 솔루션을 사용할 수 있습니다.

+3

우리는이 버그를 해결해야만 보석을 업데이트했습니다. – Snugug

1

float 출력 스타일을 사용할 수 있지만 여전히 오른쪽 열의 추가 패딩을 처리해야합니다.

http://sassmeister.com/gist/5256403 -이 링크가 작동하도록하려면 드롭 다운 메뉴에서 특이점을 선택해야 할 수 있습니다.

플로트의 경우 위치 열에 "last"를 쓰면 Susy의 "omega"와 같습니다. 여분의 패딩을 처리하는 것은 여전히 ​​까다로울 것입니다. 그러나 최소한 열이 nth없이 서로 옆에 떠 있습니다.

여전히 만족스럽지 않으면 자신 만의 출력 스타일을 작성할 수 있습니다. 어떤 CSS가 속임수를 쓰는지 확실하지 않지만 어떤 경우에도 CSS Singularity는 완벽하게 사용자 정의 할 수 있습니다. 나는 아직 완전히 문서화하지만 당신은 당신의 자신의 출력 스타일을 추가 할 수 있습니다 https://github.com/Team-Sass/Singularity/tree/1.x.x/stylesheets/singularitygs/api

+0

안녕 스콧, 해결책이 가장 짧지 않습니다! 내 대답을 고려해주십시오. –