Set CSS according to browser

4

I found a command to change CSS in Firefox:

@-moz-document url-prefix() {
    body {
        background: #f00;
    }
}

This command will put a red background in firefox, for example.

I found it very useful, but I would like to know if I can do this with other browsers, but in this style, without the use of "<!--[if IE 8]>" for example.

    
asked by anonymous 02.05.2014 / 14:46

3 answers

5

Yes it is possible, this "technique" has a name: CSS Hack , basically it abuses the rendering errors of the browsers, because they are properties written in a wrong way just not to work but browsers interpreted as valid statement, for example:

#teste {
    background-color: Red;
    _background-color: Black; // No IE o fundo ficará com a cor preta
}

There are several CSS Hacks , when you need some specific I recommend Browserhacks for consultation.

, , a

    

02.05.2014 / 14:54
1

Simple:

  • -moz is for Firefox
  • -ms for Internet Explorer
  • -o for Opera
02.05.2014 / 14:57
0

According to the W3C

The rule '@document' a group rule whose condition depends on URL of the document being formatted . This allows style sheets, especially user style sheets, to have styles that apply only to one set of pages, rather than all pages that use the style sheet.

In this way you can use the prefixes to apply style specifically to a browser and some .
To set

  • url-prefix ()
  • domain ()
  • regexp ()

View in Document queries: the '@ document 'rule how to use each of these properties.

    
02.05.2014 / 15:45