Hello! Hello! When opening an adaptive tool, there is no way to select desktop mode (e.g. fullHD or HD), only mobile and laptop. Yes, I have the opportunity to set these sizes myself (which I did), but at the same time the scrollbar does not change (it remains mobile). How can I configure the tool so that I can see how the web application will look on screens with a resolution different from mine.
Thanks for answers
Hello! Thank you for filing this issue. Right now Responsive Design Mode will always apply mobile-style scrollbars. This is certainly a problem when you want to simulate your application on desktop screens. The DevTools team will make sure to address this issue in the future.
As for configuring the tool for different environments:
-
You can already select a pre-loaded device from the device selector located on the Responsive Design Mode’s toolbar. If you wanted to simulate different devices that aren’t already available from that list, you can select the “Edit List…” option.
-
You should see a modal pop-up giving you a wider selection of devices to add to the device menu.
-
If the device you’re looking to simulate isn’t listed there, you can create a custom one by clicking the “Add Custom Device” button available in the top corner. You should see a form appear where you can enter the details of your custom device.
-
Save your custom device and exit the modal. The device you saved will be available in the device selector.
For further information on using Responsive Design Mode in DevTools, you can visit: https://developer.mozilla.org/en-US/docs/Tools/Responsive_Design_Mode#Using_Responsive_Design_Mode
Hope I was able to answer your question! Please don’t hesitate to follow-up with anything that wasn’t clear.
2 Likes