How to use Modernizr classes?

cross-browser, css, modernizr

Solution

In Modernizr, supported features are added as a class name to the root element. After inspecting the list of classes at http://modernizr.github.com/Modernizr/test/, I've found the correct class name to be `boxsizing`:

.boxsizing li { border: none }

In the default build, the `boxsizing` class seems not to be added. This can manually be added using `Modernizr.addTest`:

// The first argument is the class name
Modernizr.addTest("boxsizing", function() {
    return Modernizr.testAllProps("boxSizing") && (document.documentMode === undefined || document.documentMode > 7);
});​​​​​​

Demo: http://jsfiddle.net/eGjwZ/

Problem

I am new to modernizr. I read some documentation on modernizr, and I wanted to set `border: none` if browser doesn't support CSS3 `box-sizing: border-box`. I tried: ``` li { border-right: 1px solid #eee } .css-boxsizing li { border: none } ``` But it didnt work out. Can any1 suggest something?

Original source