A bookmarklet to outline (not border!) HTML elements

May 28, '05 09:10:00AM

Contributed by: nicwolff

One popular trick for Web designers has been to use a Javascript bookmark to add visible borders to the HTML elements on the current page, making it easier to tell where their margins and padding may be colliding. This works pretty well, but the added one-pixel borders change the dimensions of the elements slightly, so what you see isn't quite what you were getting.

Safari, however, supports the outline CSS2 attribute, which draws a line outside the border but doesn't affect the dimensions of the element. So we can use this bookmarklet instead - click it now to see its effect on this page, or drag it to your bookmarks to have it always available.

Comments (6)


Mac OS X Hints
http://hints.macworld.com/article.php?story=20050517130549424