Responsinator Bookmarklet

Created out of frustration this morning with finding which breakpoints and media queries were affecting elements on a new responsive design.

It simply adds an overlay of the current view-port width so you can easily tell which break-point to edit.

To install, drag the following link to your bookmarks bar: [ResponsinatorBookmarklet]

Compiled with the Google Closure Compiler-

Chrome Dev Tools

I love the Chrome Developer Tools and have long since switched to Chrome as my default browser for developing & everything else. This preso from Paul Irish & Pavel Feldman points out a few of the cool features of the dev tools and why you should make the switch. Slides from their presentation: