Chrome does not show width and height of screen when inspecting the page with Inspect

Recently I reinstalled my PC. When finished reinstalling everything I noticed upon using Inspect that the screen height and width of the page does not show on the top right corner anymore.

Did they remove it or is there a secret setting I haven't found yet? or maybe a bug? This made my life so much easier when I had to make a site responsive.

Solution 1:

Apparently it was removed in one of the latest updates, however you can access the Toggle device mode by pressing F12 and then pressing Ctrl + Shift + M.

If you do not like this way, you can use this example based on javascript that will tell you the current width of the window:

var onresize = function() 
{
   var width = window.innerWidth
   || document.documentElement.clientWidth
   || document.body.clientWidth;
   console.log(width);
}

Press F12 and then press Esc to see console.

Based on this answer: https://stackoverflow.com/a/28241682/3399806

Solution 2:

That was definitely a useful feature that they removed. Luckily there's a Chrome extension that you can use to achieve the same functionality:

Download here: Viewport Dimensions

Restart your browser after installing. Enjoy!

Solution 3:

I use a neat little trick I found out myself. Just keep the cursor on the body node in the inspector so that it's constantly highlighted while resizing. I really hope they reintegrate this functionality.

Here is an image for clarification: