Question

I have to write a javascript function that is returning the current size (in px) of a div. Unfortunately the div has its weight specified in % instead of px.

The style of the div: position: absolute; width: 100%; height: 100%;

And my width returning function:

function getTableWidth(tableId){
    var tabWidth = document.getElementById('pt1::tabb').children[0].children[0].style.width;
    return tabWidth;
}

tabWidth is ‘100%’.

Is it possible to return the px width instead of the % width ?

NOTE: I don’t have access to any html/css , as the page I am working on is generated through a complex framework. I can only embed javascript.

Answer 1

Each browser is different. In most you can use the clientWidth and clientHeight properties of the DOM element. In non-IE browsers you can use document.defaultView.getComputedStyle(). However I’d recommend using a framework that takes care of cross-browser issues for you. In jQuery, you can get the current width in pixels using something as simple as $(element).width().