Firefox browser tool to test Responsive Web design

Modern web browsers are more developer friendly, by providing Developer Tools to make web development easy. Thanks to Mozilla for integrating a feature, which allows to test the Responsive Web design with out using various physical devices.

How to use Responsive Web Design feature in Firefox?

  1. Launch Mozilla Firefox(Latest Version).
  2. Browse the website which you wish to test. For example – i will take – http://tickletheweb.com website, which is developed to have consistent view across the devices.

image

3.   Click on Firefox button on the left top corner of the browser, and select Web Developer –> Responsive Design View.

image

4.  It loads the Responsive Design View chrome –

image

5.  Select different resolutions from the dropdown control on the left corner of the chrome to test the website in different resolutions, which is simple and great.

image

6.  It also allows to test  Portrait or Landscape orientations. Click on rotate button, which toggles between the orientations.

image

Happy Web programming!!!

11 Comments

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s