[snippet] Default browser scrollbar width

Stackoverflow: Getting scroll bar width using JavaScript

function getScrollbarWidth() {
    var outer = document.createElement(“div”);
    outer.style.visibility = “hidden”;
    outer.style.width = “100px”;
    document.body.appendChild(outer);

    var widthNoScroll = outer.offsetWidth;
    // force scrollbars
    outer.style.overflow = “scroll”;

    // add innerdiv
    var inner = document.createElement(“div”);
    inner.style.width = “100%”;
    outer.appendChild(inner);        

    var widthWithScroll = inner.offsetWidth;

    // remove divs
    outer.parentNode.removeChild(outer);

    return widthNoScroll – widthWithScroll;
}

document.write(“Scrollbar width is: “+getScrollbarWidth()+”px”);

function getScrollbarWidth() {

var outer = document.createElement(“div”);

outer.style.visibility = “hidden”;

outer.style.width = “100px”;

document.body.appendChild(outer);

var widthNoScroll = outer.offsetWidth;

// force scrollbars

outer.style.overflow = “scroll”;

// add innerdiv

var inner = document.createElement(“div”);

inner.style.width = “100%”;

outer.appendChild(inner);

var widthWithScroll = inner.offsetWidth;

// remove divs

outer.parentNode.removeChild(outer);

return widthNoScroll – widthWithScroll;

}

document.write(“Scrollbar width is: “+getScrollbarWidth()+“px”);

Result:
WinXP: 16px;
Win7: 17px;
Win8: 17px;
Mac: 15px;