0

Estou tentando compactar ao máximo o site de onde trabalho e para isso estou minificando ao máximo os javascripts e css, porém esta dando erro ao minificar o css bem nos códigos parecidos com o que colocarei aqui em baixo. Ele faz a validação da sintaxe e ele considera essa declaração de Media Query dentro da classe principal como um erro de sintaxe, ele até funciona e deixa passar, porém ao compactar e jogar no servidor ele dá problema. Alguém sabe por que acontece isso e como resolver?

Segue um exemplo:

.img-header-home-01 {

background-image: url("../imagens/home/slider-01.jpg");
background-size: cover;
background-attachment: scroll;
background-position: center center;

@media (max-width: @iphone-screen) {
    background-attachment: scroll;
}

}

1
  • Já tentou usar o valor do iphone-screen direto em px ou rem? Commented 9/09/2016 às 13:43

1 Resposta 1

0

Mudei um pouco sua sintaxe e funcionou! Segue o exemplo:

.img-header-home-01 {

background-image: url("../imagens/home/slider-01.jpg");
background-size: cover;
background-attachment: scroll;
background-position: center center;

}

@media (max-width: @iphone-screen) {
    .img-header-home-01 {
         background-attachment: scroll;
    }
}

E mificado ficaria assim:

.img-header-home-01{background-image:url(../imagens/home/slider-01.jpg);background-size:cover;background-attachment:scroll;background-position:center center}@media (max-width:@iphone-screen){.img-header-home-01{background-attachment:scroll}}
1
  • Era isso mesmo. Muito Obrigado! Commented 9/09/2016 às 18:46

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .