2013-04-09 3 views
0

Susy 프레임 워크를 사용하여 내 웹 사이트의 눈금을 만들고 정말 좋아합니다. # margin-left : span 컬럼에서 omega를 사용할 때 -1em이 추가되는 이유를 알 수 없습니다. 그것에 대해 어떤 정보도 찾을 수 없으며 CSS 유효성을 검사 할 때이 오류가 발생합니다. .second Parse Error # margin-left : -1em;Susy Compass 오메가는 # margin-left를 추가합니다 : -1em;

내 코드는 아래

//this is the default number of columns 
$total-columns: 12; 
//width of each column 
$column-width : 4em; 
//space between columns 
$gutter-width : 1em; 
//space on the right and left of the grid 
$grid-padding : $gutter-width; 

.first{ 
    @include span-columns(6,12); 
} 
.second{ 
    @include span-columns(6 omega,12); 
} 

처럼 보이는이

.first { 
    width: 49.15254%; 
    float: left; 
    margin-right: 1.69492%; 
    display: inline; 
} 

.second { 
    width: 49.15254%; 
    float: right; 
    margin-right: 0; 
    #margin-left: -1em; 
    display: inline; 
} 

답변

3

귀하의 코드는 나침반과 나를 위해 잘 컴파일 생성합니다. 문제의 라인은 별표를 가지고 아닌 해시 마크 :

*margin-left: -1em; 

별표 (*)로 시작하는 CSS의 라인은 IE 6 ~ 7 지원을 사용하지 않으려면 IE < 만 = 7

를 작동하는 해킹이

, 가져 오기 전에 $legacy-support-for-ie을 false로 설정하십시오. Susy :

+0

답장을 보내 주셔서 감사합니다. 그것은 이상한 일입니다. 광산이 왜 *가 아닌 #로 컴파일되는지 확실하지 않습니다. IE 6-7에 대한 지원을 비활성화하고 필요한 경우 코드를 수동으로 추가합니다. – Allan

+1

최신 버전에서는'#'에서'*'로 변경되었습니다. [이 커밋] (https://github.com/ericam/susy/commit/0c11935559a5ff1a20d8800499028ca120a3baf3)을 참조하십시오. IE는 서브 픽셀 수학에 부합 할 때 반올림하므로 레이아웃을 늘릴 수 있습니다. '-1em'은 그 공간을 제공하고,'omega' 엘레멘트가 오른쪽으로 떠 있기 때문에 대부분의 사람들은주의를 기울이지 않습니다. Compass [browser support] (http://compass-style.org/reference/compass/support/) 설정을 사용하여 모든 해킹을 끌 수 있습니다 :'$ legacy-support-for-ie6','$ legacy-support- for-ie7' 또는 좀 더 일반적인'$ legacy-for-ie'를 사용합니다. –

+0

도움과 설명을 해주셔서 감사합니다. 필자는 Susy의 최신 버전으로 업그레이드하여 * 표시했습니다. – Allan