diff --git a/src/dom/layout.js b/src/dom/layout.js index 2547cd4..204fcbc 100644 --- a/src/dom/layout.js +++ b/src/dom/layout.js @@ -30,7 +30,7 @@ // When IE gives us something other than a pixel value, this technique // (invented by Dean Edwards) will convert it to pixels. - if (element.runtimeStyle) { + if (/\d/.test(value) && element.runtimeStyle) { var style = element.style.left, rStyle = element.runtimeStyle.left; element.runtimeStyle.left = element.currentStyle.left; element.style.left = value || 0; @@ -38,7 +38,7 @@ element.style.left = style; element.runtimeStyle.left = rStyle; - return value; + return value; } // For other browsers, we have to do a bit of work. @@ -57,7 +57,7 @@ } // If we get this far, we should probably give up. - return null; + return 0; } function toCSSPixels(number) { @@ -154,10 +154,9 @@ var position = element.getStyle('position'), width = element.getStyle('width'); - var layout = element.getLayout(); element.setStyle({ position: 'absolute', - visibility: 'visible', + visibility: 'hidden', display: 'block' }); @@ -177,15 +176,16 @@ } else { // If not, that means the element's width depends upon the width of // its parent. - var parent = element.up(), pLayout = parent.getLayout(); + var parent = element.parentNode, pLayout = $(parent).getLayout(); + newWidth = pLayout.get('width') - - layout.get('margin-left') - - layout.get('border-left') - - layout.get('padding-left') - - layout.get('padding-right') - - layout.get('border-right') - - layout.get('margin-right'); + this.get('margin-left') - + this.get('border-left') - + this.get('padding-left') - + this.get('padding-right') - + this.get('border-right') - + this.get('margin-right'); } element.setStyle({ width: newWidth + 'px' }); @@ -333,22 +333,22 @@ }, 'border-top': function(element) { - return element.clientTop || + return Object.isNumber(element.clientTop) ? element.clientTop : getPixelValue(element, 'borderTopWidth'); }, 'border-bottom': function(element) { - return element.clientBottom || + return Object.isNumber(element.clientBottom) ? element.clientBottom : getPixelValue(element, 'borderBottomWidth'); }, 'border-left': function(element) { - return element.clientLeft || + return Object.isNumber(element.clientLeft) ? element.clientLeft : getPixelValue(element, 'borderLeftWidth'); }, 'border-right': function(element) { - return element.clientRight || + return Object.isNumber(element.clientRight) ? element.clientRight : getPixelValue(element, 'borderRightWidth'); }, diff --git a/test/unit/layout_test.js b/test/unit/layout_test.js index 3cbb051..5b05792 100644 --- a/test/unit/layout_test.js +++ b/test/unit/layout_test.js @@ -31,29 +31,34 @@ new Test.Unit.Runner({ 'test layout on elements with display: none and exact width': function() { var layout = $('box2').getLayout(); + this.assert(!isDisplayed($('box3')), 'box should be hidden'); + this.assertEqual(500, layout.get('width'), 'width'); this.assertEqual(3, layout.get('border-right'), 'border-right'); this.assertEqual(10, layout.get('padding-bottom'), 'padding-bottom'); + + this.assert(!isDisplayed($('box3')), 'box should still be hidden'); }, 'test layout on elements with display: none and width: auto': function() { var layout = $('box3').getLayout(); - // Ensure that we cleaned up after ourselves. - this.assert(!isDisplayed($('box3')), 'box should still be hidden'); + this.assert(!isDisplayed($('box3')), 'box should be hidden'); - this.assertEqual(364, layout.get('width'), 'width'); this.assertEqual(400, layout.get('margin-box-width'), 'margin-box-width'); this.assertEqual(3, layout.get('border-right'), 'border-top'); this.assertEqual(10, layout.get('padding-bottom'), 'padding-right'); + + // Ensure that we cleaned up after ourselves. + this.assert(!isDisplayed($('box3')), 'box should still be hidden'); }, 'test layout on elements with display: none ancestors': function() { var layout = $('box4').getLayout(); // Ensure that we cleaned up after ourselves. - this.assert(!isDisplayed($('box4')), 'box should still be hidden'); + this.assert(!isDisplayed($('box4')), 'box should be hidden'); // Width and height values are nonsensical for deeply-hidden elements. this.assertEqual(0, layout.get('width'), 'width of a deeply-hidden element should be 0');