Firefox: Responsive design testing for Mobile devices
Dec 25, 2013 - by kurinchilamp / UI, CSS / Post Comment
Follow the below steps to set the preset value for responsive design testing on mobile devices
i) Go to the address bar in firefox and type "about.config"
ii) You will get a warning message stating "This might void your warranty ... Changing these advanced settings can be harmful to the stability .....". Click the button "I'll be careful, I promise!'
iii) In the search bar, type "presets" and look through the filter values for "devtools.responsiveUI.presets". Double click on the preference name "devtools.responsiveUI.presets" and enter the values
[{"key":"320x480","name":"iPhone 3g/3gs","width":320,"height":480},{"key":"360x640","name":"Nokia E7, n90","width":360,"height":640},{"key":"640x960","name":"iPhone4/4s","width":640,"height":960},{"key":"640x1136","name":"iPhone5/5c/5s","width":640,"height":1136},{"key":"768x1024","name":"ipad1/2","width":768,"height":1024},{"key":"800x480","name":"Android-WVGA","width":800,"height":480},{"key":"800x1280","name":"KindleFireHD8.9","width":800,"height":1280},{"key":"2048x1536","name":"Retina display","width":2048,"height":1536},{"key":"600x800","name":"KindleFire/Galaxy/Nexus","width":600,"height":800}]
Once the values are entered, you can open a new instance of the browser and click ctrl + shift + m to open up the responsive web view
Continue Reading