2

I have once seen safari showing me the pixel dimensions of the browser window, even when I resized it dragging left or right, it showed how many pixels in the x axis and how many pixels in the y axis.

But now when I resize the window it doesn't show the number of pixels of any current size.

How can I get the resolution / number of pixels in x and y, to show when I resize the safari browser window(as I've seen it do before)?

note- (was formerly - mistakenly - titled as safari has stopped showing me the resolution when resizing a window)

  • 1
    I can honestly say I have never seen that. Are you sure it was not a Safari extension that no longer works or another system utility? Can you be more descriptive of what you see and what it looks like? – Steve Chambers Oct 5 '18 at 20:34
  • 1
    I concur -- I've never seen any macOS application do anything like this (other than Terminal, which shows the size in character blocks in the title bar). – calum_b Oct 5 '18 at 20:52
  • @SteveChambers I found the answer.. Shall I reword the question so as to ask how to get the pixel dimensions (without any extension) ? (not that safari stopped showing me the dimensions, which wasn't correct) So that way my answer will fit the question and the question won't have an error in it – barlop Oct 9 '18 at 5:07
  • Other mod may feel differently but this Q&A likely has some value and there is no need to delete it. – Steve Chambers Oct 9 '18 at 12:32
  • @SteveChambers I wasn't suggesting deleting it, but anyway – barlop Oct 9 '18 at 15:30
2

You have to have the element inspector open. So with element inspector open, then, In Safari, when you hover over an element, it shows the pixels.

And you can get it to show the pixels while you resize a window, to do that you click the crosshair icon in the inspector, then hover over the background so it shows the pixels, then move the mouse across so it still shows the pixels, and resize the window and it will update the pixel dimensions.

Note that in Chrome, if you have the inspector open, and resize, then it shows you the pixel dimensions while you resize.

  • what is the element inspector and how do you open it? – jmh May 3 at 23:40
  • First enable the Develop menu in Preferences > Advanced. Then choose Show Web Inspector from that menu or press Option-Command-I – Richard Brockbank May 4 at 0:22
0

Although the accepted answer works ok for individual elements as you hover, it can be tricky to capture the entire browser / window viewport as you try to resize.

Another approach would be Safari's Responsive Design Mode, which will show you the width and height in pixels as you resize. Its tucked away in the Develop Tab, then Enter Responsive Design Mode

enter image description here

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .