The picture I uploaded is too large... Is there a way to limit the size (width & height)?
3 Answers
If you are using the native Stack Overflow imgur service (eg. clicking the little icon for adding an image in the toolbar), you can just append an s
or m
or l
(for small/medium/large) at the end of the URL, before the file extension.
https://i.sstatic.net/kXY0J.jpg
https://i.sstatic.net/kXY0Jm.jpg
https://i.sstatic.net/kXY0Js.jpg
You could link to the full-size image if you want, too.
-
6Yup. This. And you should be using the provided image hosting anyway, since that helps to keep down image rot. Commented Jul 20, 2013 at 9:02
-
Even adding
l
for "large" is actually useful to save bandwidth: i.sstatic.net/8IlR6.jpg vs i.sstatic.net/8IlR6l.jpg Thinking about it, maybe Stack Exchange should do that by default.– ArjanCommented Jul 20, 2013 at 9:13 -
@Arjan Then if we wanted to post a giant picture of a unicorn, how would we do it? We'd need a new
h
suffix for "huge". Commented Jul 20, 2013 at 9:34 -
Or remove the
l
, @Cody, if you'd know how the image insert works. Alternatively, Stack Exchange could post-process the pre-cooked HTML, to only add thel
on the regular site, but I guess that's a no go. (In the regular site, the posts are limited to 660px, and imgur's "large" is 640px. So, we're 20px short if Stack Exchange would always add thel
for the regular site only. But again: that needs post-processing of the cached HTML. On mobile, there's onlymax-width: 90%
for images, so indeed image width could exceed imgur's 640px.)– ArjanCommented Jul 20, 2013 at 9:47 -
It didn't work for me while I was creating the question. But after posting the question, I could edit and the feature worked fine.– nevesCommented May 14, 2021 at 21:08
You can use <img>
tag to place the image and control its size:
<img src="{link to image}" width="{width}" height="{height}" />
Optionally, you can also leave out either height
or width
(but not both) to proportionally set the other value.
<img src="{link to image}" width="{width}" />
Examples
Resized to 200 by 200 in <img>
:
<img src="https://via.placeholder.com/100" width="200" />
Resized to 150 by 150 in <img>
:
<img src="https://via.placeholder.com/100" width="150" />
Original image, 100 by 100 pixels.
![](https://via.placeholder.com/100)
Resized to 50 by 50 in <img>
:
<img src="https://via.placeholder.com/100" width="50" />
Resized to 25 by 25 in <img>
:
<img src="https://via.placeholder.com/100" width="25" />
Resized to 10 by 10 in <img>
:
<img src="https://via.placeholder.com/100" width="10" />
-
True, but note that the mobile theme uses
max-width: 90%
which might yield odd results when setting bothwidth
andheight
. Also, this should not be used to resize huge images (see Please do something to encourage people to scale down their giant heavyweight photos.)– ArjanCommented Jul 20, 2013 at 9:09 -
if using
<img
it may be good to usealt=" ... "
for accessibility as well Commented May 19, 2020 at 16:37 -
@nonopolarity Unfortunately you cannot use
<img />
inside a StackExchange answer post with bothwidth=""
andalt=""
at the same time, I don't know if that's a bug or not.– DaiCommented Jan 19, 2022 at 10:39
At the moment picture resize feature is not available. You have to do it manually by local software.