element javascript position code not working....

The following code is supposed to get the bottom right position of a textbox and set the top left position of a span to those coordinates. It works great with ie7, but not with firefox... any clues?

window.onload = function(){
            computeBottomRight();
        }        
        
        window.onresize = function(){
            computeBottomRight();
        }
        
        function computeBottomRight(){
            //Get the "anchor" element and store it in variable
            var element = document.getElementById("TextBox1");
            
            //get element that moves with the anchor            
            var movableElement = document.getElementById("span1")
            
            //get the length and width of anchor element and store them
            var elementWidth = element["offsetWidth"];
            var elementHeight = element["offsetHeight"];
            
            //Compute top right of anchor element and add width & height
            //to get bottom right position
            var x = getAbsPos(element,"Left") + elementWidth;
            var y = getAbsPos(element,"Top") + elementHeight; 
            
            //Display coords of bottom right in textbox
            document.getElementById("TextBox1").innerText = "(" + x + "," + y + ")";
            
            //move the movable element 
            movableElement.style.pixelLeft = x;
            movableElement.style.pixelTop = y;
        }
        
        function getAbsPos(element, side){
            var position = 0;
            while (element != null) {
                position += element["offset" + side];
                element = element.offsetParent;
            }
            return position;
        }

Code (markup):

 

edit doble posting

 

try it in firefox and tell us what kind of errors it says

 

There are no errors or warnings. Not even in the FireFox error console.... any clues????

 

OK! Found the fix.... setting the left needs a unit in firefox, not to mention that pixelLeft and pixelTop are IE proprietary.

            //move the movable element 
            movableElement.style.pixelLeft = x;
            movableElement.style.pixelTop = y;

            //becomes...

            //move the movable element 
            movableElement.style.left = x + "px";
            movableElement.style.top = y + "px";

Code (markup):

However, one more thing to note... when using IE, when you resize, the window.onResize is fired during the whole time you are resizing the window. This makes the movable element to constantly move in order to keep its relative distance to the "anchor."

In FireFox, the position of the movable object only re-renders when you finish with resizing the browser window... anyone know how IE differs from FireFox on this????