28 February 2017

Firefox Responsive UI

When designing and building websites we need to consider multiple screen resolutions and platforms e.g. iPhone Safari browser, or Pixel C Android tablet in landscape mode.

Resolution Design Mode
Firefox has an excellent Resolution Mode that allows you to select a variety of resolutions. You can also import more:

  1. In Firefox go to about:config and accept the risk
  2. Right click and select New, String, 'devtools.responsiveUI.presets'
  3. Enter the new values e.g. Thanks to Geoffrey Liu for this version
  4. Close any RDM tabs and re-open them to see the new options
User Agent
When changing the resolution we may need to also change the User Agent. Firefox has a plugin for that: written by Chris Pederick User Agent Switcher: download, install and add the list of user agents.
You can check your UserAgent at UserAgentString.com

No comments:

Post a Comment