calc() fallback script

I wrote a failback for the fairly new CSS calc() rule. It works fine but I want to use it in a production environment and would appreciate feedback. Please recommend anything regarding weird/wrong code, possible optimizations, or a way to reduce code size.

// CSS calc() replacement
function calcfailback(){
   var d = document.createElement('div');
   var _body = document.getElementsByTagName('body') [0];
   _body.appendChild(d);
   d.style.visibility = 'hidden';
   d.style.width = "-webkit-calc(10px)";
   d.style.width = "-o-calc(10px)";  
   d.style.width = "-moz-calc(10px)"; 
   d.style.width = "calc(10px)";   
   var newwidth = d.offsetWidth;
   if (newwidth == "10"){}
   else{
      function resize(){
         document.getElementById('content').style.height = window.innerHeight - 40 + 'px';
         document.getElementById('content').style.width = window.innerWidth - 300 +'px';
         document.getElementById('sidebar').style.height = window.innerHeight - 40 + 'px';
      };
      resize();
      window.onresize = function (){
         resize();
      }
   };
   _body.removeChild(d)
};
window.onload = calcfailback;

It would probably be a good idea to generalize your code so you can use it with different values. I'm not suggesting you support the full calc() syntax, but making it configurable at least could be useful if you plan on using it in more than one place.

For the code you have though, I just have a couple suggestions:

-
I typically avoid underscores in variable names, but that's just a preference (although one that a lot of style guides I've seen share).

-
Replace if (newwidth == "10"){} else with if (newwidth !== 10) {. Instead of doing nothing in the true case, switch the comparison and skip the else. You can also compare directly with the number 10 (using the strict equality operator) instead of doing a string comparison.

-
Function declarations are technically not legal inside if statements in ECMAScript (they are only allowed at the global scope, or the top level of a function). Browsers tend to support it as an extension, but they behave differently and it can cause problems, so it's best to avoid that. Function expressions are fine, so I assigned an anonymous function directly to window.onresize and called it through that. You could also assign the function to a variable (replace function resize() {...} with var resize = function() {...};).

-
Instead of calling document.getElementById('content') three times, store the style object in a variable and reference that. You'll gain a speed and file-size advantage.

-
Semicolons aren't needed after function declarations or after an if statement block.

Here's what I ended up with:

// CSS calc() replacement
function calcfailback() {
    var d = document.createElement('div');

    // 1
    var body = document.getElementsByTagName('body')[0];
    body.appendChild(d);
    d.style.visibility = 'hidden';
    d.style.width = "-webkit-calc(10px)";
    d.style.width = "-o-calc(10px)";  
    d.style.width = "-moz-calc(10px)"; 
    d.style.width = "calc(10px)";   
    var newwidth = d.offsetWidth;

    // 2
    if (newwidth !== 10) {
        // 3
        window.onresize = function() {
            // 4
            var contentStyle = document.getElementById('content').style;
            contentStyle.height = window.innerHeight - 40 + 'px';
            contentStyle.width = window.innerWidth - 300 +'px';
            contentStyle.height = window.innerHeight - 40 + 'px';
        };
        window.onresize();
    } // 5
    body.removeChild(d);
} // 5
window.onload = calcfailback;

StackExchange Code Review Q#14392, answer score: 3