I just noticed, while writing an answer, that if I put a larger image inside a blockquote
it overflows.
Here is an example:
That happens because the blockquote
has padding:10px
.
I just noticed, while writing an answer, that if I put a larger image inside a blockquote
it overflows.
Here is an example:
That happens because the blockquote
has padding:10px
.
Images now have a max-width of 100% so they cannot expand outside of whatever nested element contains them.
A possible solution would be reduce the max-width:660px
but just inside the blockquote
, something like:
.someclass blockquote img {
max-width:635px /* or other value */
}
Alternatively we can add some letters in front of URL,
Original url: https://i.sstatic.net/Yj6Zh.png
Modified url https://i.sstatic.net/Yj6Zhm.png
Example with m
Full table:
s: small square 90×90 (forced)
b: big square 160×160 (forced)
t: small thumbnail 160×160
m: medium thumbnail 320×320
l: large thumbnail 640×640
h: huge thumbnail 1024×1024
max-width:100%
would be the best solution, but I did mention /*or other value */