Jan
17
(2006)
New DOM/CSS Inspector in Safari
Filed under: Uncategorized. Tags: developmenttools, safari.
Dave Hyatt Tim Hatcher announced last night that the latest nightly builds of Safari now include a new tool for web developers to view DOM and CSS elements/attributes on a web page. I tried it last night, and it’s excellent – even better than the one built into Firefox. You just right-click anywhere on a page, and a contextual menu item will let you “Inspect Element”. This is perhaps more intuitive than Firefox’s “enter a new mode, then click somewhere on the inspected page” method of visually selecting an element to inspect.
Here’s a screenshot of the fancy new inspector, being used to debug a CSS problem I was having with the text in the header of my blog:

Update: I spaced on the author of the post. I guess I still think of the WebKit blog as Dave’s old Surfin’ Safari blog. It ain’t, and there are multiple authors on the new WebKit blog. Oops.


Doh! Thanks for the correction, Mark! I was still thinking of the WebKit blog as Surfin’ Safari, which was All Dave, All The Time. But of course that isn’t the case on the new WebKit project blog. My bad. I’ve corrected the post for the sake of Google.
A slight correction — the post about the Web Inspector was by Tim Hatcher, also known as “xenon”. He’s a relatively new member of the WebKit/Safari team at Apple and was responsible for most of the implementation of the new Web Inspector feature.
Web Inspector
Surfin’ Safari †Blog Archive †Introduc…