getElementById().styleで得られるスタイルシートの情報は、要素のインラインで設定されているもののみだそうです。 ブラウザ上で適用されているスタイルを呼び出したい場合は、getComputedStyle()（読み取り専用）を使います。

使い方は、

var Element = document.getElementById("ElementのID");
document.defaultView.getComputedStyle(Element, null).getPropertyValue("cssプロパティ名");

最後のgetPropertyValue()がなくても、getComputedStyle後にプロパティ名を直接書いても使えるようです。[例］↓

document.defaultView.getComputedStyle(Element, null).width;

IEでは上記のメソッドが使えないので、currentStyleを使います。

Element.currentStyle.[CSSプロパティ名]

でよいはずです。

これらをひとつの関数にまとめてみました。

var STYLE = function (aElement, aCssProperty){

	var tElementId = document.getElementById(aElement);

	if(tElementId.currentStyle){
		return tElementId.currentStyle[aCssProperty]; //IE
	}
	else{
		var style =  document.defaultView.getComputedStyle(tElementId, null)　//firefox, Operaなど
		return style.getPropertyValue(aCssProperty);
	}

}

呼び出しは

STYLE("エレメント名", "cssプロパティ名");

です。IE7、Firefox2、Opera9で動作確認ができました。

ちなみにIEとMozilla系のCSSプロパティの書き方が違う場合があるそうなので、引数を分けたほうがよさそうなのですが 今のところこの関数ではwidthとheightしか使う予定がないので割愛しました。

[参考にさせて頂いたウェブサイト］

• DOM:window.getComputedStyle – MDC
• getComputedStyle について調べてたら深みにハマったのでメモ
• スタイルシートの有効なプロパティ値を読み出す – Backstage of theater.js