2015-01-12 2 views
1

내 SCSS 파일을 CSS로 컴파일하기 위해 Prepros를 사용하고 있지만 미디어 쿼리를 사용하려고 할 때 오류가 발생합니다. 나는 코알라와 스카우트도 시도했다. 이 코드를 출력 CSS로 복사하면 작동합니다. 내가 뭘 잘못 했니?SCSS @media 컴파일 오류

@media only screen and (max-width: 320px) { 
    body { 
    width: 320px; 
    } 
    .wrapper { 
    width: 320px; 
    margin: 0 auto; 
    } 
    .works-wrap { 
    width: 320px; 
    } 
} 

@media only screen and (min-width: 320px) and (max-width: 610px) { 
    .wrapper { 
    width: 320px; 
    margin: 0 auto; 
    } 
    .works-wrap { 
    width: 320px; 
    } 
} 

@media only screen and (min-width: 610px) and (max-width: 950px) { 
    .wrapper { 
    width: 650px; 
    margin: 4% auto; 
    } 
    .name { 
    width: 100%; 
    } 
    .works-wrap { 
    width: 650px; 
    margin-left: 10px; 
    } 
}​ 

@media only screen and (min-width: 950px) and (max-width: 1024px) { 
    .wrapper { 
    width: 950px; 
    margin: 4% auto; 
    } 
    .name { 
    width: 100%; 
    } 
    .works-wrap { 
    width: 950px; 
    } 
} 

오류 코드 :

Error: Invalid CSS after "​": expected selector, was "@media only scr..." 
     on line 169 of style.scss 

164:  width: 650px; 
165:  margin-left: 10px; 
166: } 
167: }​ 
168: 
169: @media only screen and (min-width: 950px) and (max-width: 1024px) { 
170: .wrapper { 
171:  width: 950px; 
172:  margin: 4% auto; 
173: } 
174: .name { 

Backtrace: 
style.scss:169 
c:/Program Files (x86)/Prepros/resources/app/ruby/ruby_gems/gems/sass-3.4.9/lib/sass/scss/parser.rb:1165:in `expected' 

답변

0

@media only screen and (min-width: 610px) and (max-width: 950px)의 브래킷을 닫는 단지

@media only screen and (max-width: 320px) { 
    body { 
     width: 320px; 
    } 
    .wrapper { 
     width: 320px; 
     margin: 0 auto; 
    } 
    .works-wrap { 
     width: 320px; 
    } 
} 

@media only screen and (min-width: 320px) and (max-width: 610px) { 
    .wrapper { 
     width: 320px; 
     margin: 0 auto; 
    } 
    .works-wrap { 
     width: 320px; 
    } 
} 
@media only screen and (min-width: 610px) and (max-width: 950px) { 
    .wrapper { 
     width: 650px; 
     margin: 4% auto; 
    } 
    .name { 
     width: 100%; 
    } 
    .works-wrap { 
     width: 650px; 
     margin-left: 10px; 
    } 
} 

@media only screen and (min-width: 950px) and (max-width: 1024px) { 
    .wrapper { 
     width: 950px; 
     margin: 4% auto; 
    } 
    .name { 
     width: 100%; 
    } 
    .works-wrap { 
     width: 950px; 
    } 
} 

숨겨진 문자 있습니다 그것은 복사/붙여 넣기 실수이 시도 단지 삭제하십시오

+0

고마워! 도움이됩니다. 어떻게 직접 찾을 수 있습니까? –