Q1: What is the current maximum image width that does not get auto-scaled down?

Q2: Are these widths the same on different Stack Exchange sites, e.g. for Mathematics, Physics, Stack Overflow, etc...

The various answers, quoted below, list different maximum image widths (in pixels) that DO NOT get automatically scaled down and are displayed in their originally uploaded resolutions:

What is the maximum/default width of an image tag in a question or answer?
What is the maximum pixel width for images to be displayed without resizing?
How are image dimensions scaled?
Images should have a maximum width when browsing Posts in profile on stackexchange

1 Answer 1


Images do not get scaled down; they're embedded as they are (which means large images take a long time to download), but their maximum displayed width might be smaller. Since the introduction of responsive design, this depends on the browser width.

enter image description here

The line above is a 3200 x 10 image which (in my browsers) is resized to 677 pixels wide. There's a div#content whose max-width is hardcoded to 1100 pixels with 24 pixels padding (left and right), so there is 1052 pixels left; the div#mainbar has a width of calc(100% - 300px - 24px); which amounts to 728 pixels. The post body shares that space with the vote cell (36 pixels wide, as specified in the vote button SVGs), with a padding of 15 pixels between them. That leaves 677 pixels for the post body (and the image).

At a screen width of 816 pixels and lower, the horizontal padding of the div#content changes to two times 16 pixels, and the width of the mainbar changes to 100%, so then the width is (screen width - 32 - 36 - 15), which has a maximum of 733 pixels. So interestingly the image will be displayed a bit wider then, at least just below a screen width of 816 pixels.

That's here on Meta.SE; there are some sites with a border in their design, even on the Q&A page, e.g. Photography. Those borders eat away one or two pixels. I'm not sure if your interested in that order of variations; if you are, you browser's developer tools are your best friend. Science Fiction & Fantasy's vote buttons have some extra margin (2px left and right), further reducing the image space.

  • Yes, I was asking about the maximum displayed width. I tacitly assumed browser window's width >> post's width. IOW: Post width not restricted by the browser widow's width. Jul 26, 2019 at 22:06
  • When I inspect the image element above in FF and Chrome I get a max of 672 at the "normal" desktop display size, and 713 when the window is scaled a bit smaller (and the right sidebar reflows). Since it's unlikely a user will size their window to exactly that size where the 713 max occurs (a range of just 41 pixels), I would consider the 672 figure to be the "standard" max - the one that's actually likely to be seen. Of course, we're talking CSS pixels, so actual image pixels should be double that (1344) to support Retina. Example syntax: <img src="https://placehold.it/1344" width="672"/>
    – Mentalist
    Nov 21, 2019 at 8:35
  • That said, taking into consideration what you mentioned about each site on the network having its own varying CSS, inspecting a maxed out image on that given site to get the width in CSS pixels (and preparing a x2 image for Retina) is the way to go. (P.S. since my measurements differ from yours, I wonder if the CSS has been modified in recent months...)
    – Mentalist
    Nov 21, 2019 at 8:40

You must log in to answer this question.

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