Is there any way for the browser to test my websites in resolutions that are higher than my screens?
E.g: I have a 1440 x 900 screen, and I want to test the website in 1920 x 1200, 1920 x 1080, etc.
Go to the desktop, right click and click NVIDIA Control Panel. When you're at the Control Panel, click "Adjust desktop size and position". There should be an option called "Perform scaling on", change the setting to : "GPU".
Press Ctrl+Shift+M and firefox shall switch to 320 X 480 Resolution, Now you can edit the values in top and set it to 4096 X 2160 to emulate 4k resolution.
To activate device mode, simply click the device icon in the top left corner of the Developer Tools window. Click to the icon to toggle device mode. A toolbar will appear at the top of the page where Chrome will emulate different devices with viewport sizes, throttling options, and other features.
[Edit: Check your browser's devtools first! As @SkylarIttner points out in the comments, tools for responsive design testing have been rolled out since in most browsers since the below solution was posted. They are likely the best/easiest option now.]
You could, correct me if I'm wrong, simply create an iframe with style="desired width & height"
and src="your/test.site"
as the only child of <body>
. Should display the site as if the resolution was the specified width/height and result in scroll bars to examine it.
Not as convenient as using a third party, having to set it up yourself, but has the advantage of being able to test locally with no internet connection.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With