|
JavaScript CSS Tool: Convert Margins To Padding
|
|
Jonathan Aquino August 30, 2006
|
Ever wonder what the source of those mysterious gaps on your webpage
is, but Web Developer Extension won't tell you because it can only
inspect padding but not margins? You click on the space, but in
vain--Firebug won't tell you the source element because that gap is
caused not by an element's padding but by some errant margin.
Enter
"Convert Margins To Padding". Just paste this javascript snippet into
the Firebug command line, and it will replace all elements' padding
values with their margin values. Then you can click on the mysterious
gap and discover its element.
var elements = document.getElementsByTagName('*'); for (var i =
0; i < elements.length; i++) { elements[i].style.paddingTop =
document.defaultView.getComputedStyle(elements[i],
'').getPropertyValue('margin-top'); elements[i].style.paddingRight =
document.defaultView.getComputedStyle(elements[i],
'').getPropertyValue('margin-right'); elements[i].style.paddingBottom =
document.defaultView.getComputedStyle(elements[i],
'').getPropertyValue('margin-bottom'); elements[i].style.paddingLeft =
document.defaultView.getComputedStyle(elements[i],
'').getPropertyValue('margin-left'); elements[i].style.marginTop = '0';
elements[i].style.marginRight = '0'; elements[i].style.marginBottom =
'0'; elements[i].style.marginLeft = '0'; }
____
This article is licenced under the Creative Commons License.
|
|
|