View Full Version : getting the actual width and height of a span

06-29-2004, 06:46 PM

I have defined a span object and gave it an id.
The span contains nested tags which define its content.

Is there a way of know what are the precise dimensions of the span in pixels?
I would like to know what are the width & height that the span will occupy once it will be display on the screen.

I tried the following:

var spanObj = document.getElementByID('mySpan');
var width = spanObj.style.width;
var height = spanObj.style.height;

That however gives me the width and height values that I have set when the span was defined. If the dimensions of the span become different once it is displayed, then I don't know what the new dimensions are.

I even tried:

var spanObj = document.getElementByID('mySpan');
var width = spanObj.runtimeStyle.width;
var height = spanObj.runtimeStyle.height;

thansk in advance

Willy Duitt
06-29-2004, 06:59 PM
Did you try offsetHeight & offsetWidth?

<span onmouseover="alert('innerWidth= '+this.offsetWidth+'\ninnerHeight= '+this.offsetHeight)">xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx</span>


06-29-2004, 07:00 PM

06-29-2004, 07:58 PM
offsetWidth & offsetHeight worked perfectly

07-01-2004, 10:53 AM
currentStyle method is not recognized by Mozilla...