@ -moz-document und @media zusammen

Question

Wie kann ich obige Präfixe kombinieren? Dies funktioniert nicht:

@media screen and (max-width: 991px) and (min-width: 768px) { 

    @-moz-document url-prefix() { 
    .navbar-default .navbar-brand {margin-left:30%;} 
    } 
} 

Und @media innerhalb von @-moz-document url-prefix() auch deosn't Arbeit.

Answer 1

Es funktioniert gut für mich durch die @-moz-document zuerst und die @media Abfrage mit innen:

@-moz-document url-prefix() { 
    @media screen and (max-width: 991px) and (min-width: 768px) { 
     .navbar-default .navbar-brand {margin-left:30%;} 
    } 
} 

Demo: JSFiddle

Answer 2

Jedes Pseudo-Element innerhalb einer Regel gültig sein muss, da sonst die ganze Regel ist gefallen.

Siehe auch: https://developer.mozilla.org/en-US/docs/Web/CSS/@document und http://www.w3.org/TR/css3-syntax/#rule-sets