Testing responsive layouts with the RWD bookmarklet

• 1 min read
chromeresponsive-designweb-development
This post was published in 2013 and is kept here for reference. It may contain information that's outdated or inaccurate. All external links and references have been updated to point to archived versions on archive.org where possible.

Lately I’ve been doing some work with responsive CSS and media queries. This bookmarklet has been very useful. It allows you to switch between four different browser widths (for iPad and iPhone in portrait/landscape orientations).

To use it’s quite simple:

  • Drag the bookmarklet to your bookmarks bar (or rightclick the bookmarklet and bookmark it)
  • View the page you want to test your responsive break points on
  • Click the bookmarklet, it will load the toolbar
  • Switch between the different screen sizes using the toolbar

You can find the Responsive Design Bookmarklet at Victor Coulon’s website

I’ve made this in to a Chrome Extension, you can find it here: RWD Extension for Google Chrome

This post is also available in plain text

[Comments]

Want to comment? You can do so via Github.
Comments via Github are currently closed.

[Webmentions]

Want to reply? I've hooked up Webmentions, so give it a go!