Display current screen size - Responsive Design tools

javascript css firefox responsive-design browser-plugin
Jamie Hutber picture Jamie Hutber · Dec 10, 2012 · Viewed 32.7k times · Source

I'm doing a lot of responsive design development at the moment, as are all front-end devs.

One thing i would love to know is the exact current screen size.

Chrome has it: https://chrome.google.com/webstore/detail/window-resizer/kkelicaakdanhinjdeammmilcgefonfh

How can I display the current screen size with Firefox?

Answer

Jamie Hutber picture Jamie Hutber · Jan 31, 2014

Its a very old question but worth mentioning.

Firefox now has "Responsive Design Mode" Which is the best to doing responsive testing that I've seen on any browser.

the shortcut is Cntrl+Shift+M and you're in a fantastic mobile view with complete control over the size of the screen whilst still being able to open the dev tools.

enter image description here

Update - Chrome Tools

Its been a while since this answer and since Firefox's mobile development tools haven't changed a whole deal, Google Chromes have changed a whole lot and are so fantastic it would seem silly not to share for those that haven't already used it.

Hit F12 then this will open, then hit the small mobile icon to bring up the mobile development tools:

How to Enable Mobile Dev Tools on Chrome

This will open the mobile dev tools which looks like this Such lovelyness it hurts

From here you can change all sorts of things, but easily between devices with the pre-defined devices and user-agents automatically set for you.

More over you can change things, like touch, geo-location etc

Related questions

"The stylesheet was not loaded because its MIME type, "text/html" is not "text/css"

I have a javascript application and when I run it on firefox I am getting the following erro on the console: "The stylesheet was not loaded because its MIME type, "text/html" is not "text/css". DumbStuck!! EDIT: Note that …

Read More
clientHeight/clientWidth returning different values on different browsers

Properties document.body.clientHeight and document.body.clientWidth return different values on IE7, IE8 and Firefox: IE 8: document.body.clientHeight : 704 document.body.clientWidth : 1148 IE 7: document.body.clientHeight : 704 document.body.clientWidth : 1132 FireFox: document.body.clientHeight : 620 document.body.clientWidth : 1152 Why does this …

Read More
Using JavaScript to edit CSS gradient

I am working on editing CSS gradients through JavaScript in Firefox. I have input boxes where the user can put 1. Orientation 2. 1st Color 3. 2nd Color Here is the html <html> <head> <title>Linear Gradient …

Read More