How to get CSS style value?

[jaschulz]

Given the following CSS:

#centerCol {
padding: 5px 0px 5px 0px;
}

does this:

oCenterCol = document.getElementById('centerCol');
alert(oCenterCol.style.paddingTop);

show no error, but an empty alert dialog?

Thanks,

JAS

 

[ninjadeathmonkey]

You have to kind of "hack" it (only works in newer browsers).

Firefox/Opera:

var center = document.getElementById("centerCol");
var padTop = document.defaultView.getComputedStyle(center,null).paddingTop;
alert(padTop);

IE:

var center = document.getElementById("centerCol").currentStyle.paddingTop;
alert(center);

Ron Wheeler

http://www.tekdev.com/

 

[jaschulz]

I found this on the O'Reilly site:

function getElementStyle(elemID, IEStyleProp, CSSStyleProp) {
var elem = document.getElementById(elemID);
if (elem.currentStyle) {
return elem.currentStyle[IEStyleProp];
} else if (window.getComputedStyle) {
var compStyle = window.getComputedStyle(elem, "");
return compStyle.getPropertyValue(CSSStyleProp);
}
return "";
}

It works.

Thanks,

JAS