Question

Is there a way to check if the CSS function calc is available using JavaScript?

I found lot of questions and articles about getting the same behaviour as calc using jQuery, but how can I only check if it’s available?

Answer 1

In Modernizr you can find the test as css-calc currently in the non-core detects. They use the following code:

Modernizr.addTest('csscalc', function() {
    var prop = 'width:';
    var value = 'calc(10px);';
    var el = document.createElement('div');

    el.style.cssText = prop + Modernizr._prefixes.join(value + prop);

    return !!el.style.length;
});