As a security precaution, we have turned on the setting "Require API key authentication for API requests" for everyone. If this has broken something, please contact
Last Comment Bug 136002 - inconsistant margins (no right margin) when viewing straight image (jpg)
: inconsistant margins (no right margin) when viewing straight image (jpg)
[fixed by bug 376997]
Product: Core
Classification: Components
Component: Layout: Images (show other bugs)
: Trunk
: All All
: -- minor (vote)
: ---
Assigned To: Nobody; OK to take it and work on it
: Jet Villegas (:jet)
: 125319 314667 (view as bug list)
Depends on:
Blocks: 261534 655594
  Show dependency treegraph
Reported: 2002-04-06 20:23 PST by Chris Casciano
Modified: 2011-12-23 12:51 PST (History)
7 users (show)
See Also:
Crash Signature:
QA Whiteboard:
Iteration: ---
Points: ---
Has Regression Range: ---
Has STR: ---

screenshot with all margins showing (583.84 KB, image/jpeg)
2002-04-06 20:34 PST, Chris Casciano
no flags Details

Description User image Chris Casciano 2002-04-06 20:23:10 PST
Running 2002040608/OS X when I view a large (requires horiz. scroll) image
outside of an html doc I see that there is some padding/margin being added
around the image. The amount of white space is inconsistant and looks bad. The
top and the left are the same, the bottom is slightly larger, and there is NO
space at all on the right side of the image. It is this last bit that bothers me

Although this isn't a major bug I can't imagine it would take much to change.
Comment 1 User image Chris Casciano 2002-04-06 20:34:55 PST
Created attachment 78069 [details]
screenshot with all margins showing

This shows the current margins around the image. I used
javascript:window.resizeBy(a,b) until I hit the smallest size that didn't have
scroll bars. The inconsitancies around the image should be pretty clear.
Comment 2 User image Boris Zbarsky [:bz] (still a bit busy) 2002-04-17 00:23:53 PDT
So.. what would you expect the rendering to be in your test?  Just have a
scrollbar that lets you scroll a few pixels to the right?
Comment 3 User image Chris Casciano 2002-04-17 06:47:39 PDT
Just some consistancy in the presentation, however that is arrived at. Repeating
the left margin would be fine, deleting it would be ok, too. The current
behavior looks like a mistake.

For reference:

Browsers with no margin: Opera, IE/Mac
Browsers with consistant margin: NN4, IE/PC
Comment 4 User image Boris Zbarsky [:bz] (still a bit busy) 2002-04-17 08:50:32 PDT
To imagelib.  The image document we generate should be changed somehow... not
sure exactly how, to get the desired effect.
Comment 5 User image Stuart Parmenter 2002-04-22 15:11:10 PDT
-> content viewer stuff
Comment 6 User image Chris Casciano 2003-01-10 11:46:22 PST
Should it really take 9 months to fix what seem like a relatively simple issue
of consistancy??
Comment 7 User image Christian :Biesinger (don't email me, ping me on IRC) 2003-01-10 12:17:13 PST
well the generated document is basically just <html><body><img src="...">
the margin is the default margin for html documents, presumably from html.css or
something like that...

Should the imagedocument add a style around the image
"margin-right:5px;margin-bottom:5px;"? that sounds stupid to me.
Comment 8 User image Boris Zbarsky [:bz] (still a bit busy) 2003-01-10 13:15:57 PST
Actually, I think the right thing to do may be to take out the silly <p> and to
add styles to the image, yes.

Do you have time to play with that, biesi?

Chris, it's just a matter of priorities and workload... fixing this bug would be
fairly time-consuming compared to the benefits, so no one has stepped up.  Would
you be interested in taking the time to maybe do it?  The code is in 
nsImageDocument::CreateSyntheticDocument at
and is fairly straightforward; it's just not clear to me what styles should be
set on what elements to get the desired effect.
Comment 9 User image Chris Casciano 2003-02-01 23:06:08 PST
Just taking a look at the file you referenced, and all I see is the creation of
the doc and the attachment of an image element, but no <p> element as I had
expected after your comments. If at a glance you confirm that the doc is now
simply a blank doc with an image[1] I'll go digging through the default CSS
doc(s) to see if I can find where the cleanup needs to be.

Also, it looks like the file changed some since the auto image resizing landed.
Oddly enough with image resizing on the right and left margins are equal. Its
only when its off and a horizontal scroll bar appears that i'm not seeing the
right margin. This leads me to believe this may not be an issue with the default
doc, but with some collapsing or otherwise poorly handled extra margin.

[1] Not being at all familiar with the mozilla code I got this impression after
seeing this:
Comment 10 User image Boris Zbarsky [:bz] (still a bit busy) 2003-02-01 23:15:02 PST
> but no <p> element

Yep.  It got removed when the auto image resizing landed recently.  So the new
structure is:


> otherwise poorly handled extra margin

Ah.  Heh.  See, when image resizing is on, we fit the image inside the <body>
content area.  The margin is on the <body>.  So you see a margin.

When image resizing is off and the image is too wide, it overflows the <body>
(which ends at the right edge of the original viewport).  Then the image extends
_past_ the <body> margin and there is no margin.

Simply removing the <body> margins and putting the margin on the <img> should
rectify the situation, I suspect... (you could test this with DOM Inspector).
Comment 11 User image Chris Casciano 2003-02-09 08:16:52 PST
*** Bug 125319 has been marked as a duplicate of this bug. ***
Comment 12 User image Alfred Kayser 2003-08-20 01:16:41 PDT
Another question is whether when viewing an image that there should
be any margin at all. For viewing large images, I prefer no margin at all.

The fix would then be to explicitly set margin to none for the body surrounding
the image. Or to set an special class name to the body, so that res/html.css
can then define it to contain 'margin: none', and that users can overrule it
using userContent.css.

On this topic, how about centering the image in case of single image view, just
like the other media (quicktime, etc)?
Comment 13 User image Jeremy M. Dolan 2003-08-20 01:38:15 PDT
> For viewing large images, I prefer no margin at all.

in the vast majority of cases, having the image flush with chrome looks
terrible. IE and NS4 have a margin for a reason.

> how about centering the image in case of single image view, like other media

text/plain isn't centered. Content goes left to right, here in the civilized
world. Anything else is disorienting. Additionally, the image should be
top-most, for quicker mouse access to context functions (copy, save, etc.).

Had anyone tested Boris' suggestion of putting the margin on <img>?
Comment 14 User image Jeremy M. Dolan 2003-08-20 01:52:26 PDT
Just played with it a bit. To get consistent borders, all that is needed is
margin-right: 8px on the <img>.

My test document is now this:

<img src="recolte_big.jpg" style="margin-right: 8px;">

All four borders are now 8px. (The elimination of the <p> had already fixed the
bottom being too long)

NOTE that adding a 8px margin to the bottom, or top/right sides makes those two
big. The default <body> margin sets those properly. This additional style is an
appropriate rendering "hint" since the content is one big block element.

Can someone please check in this half-a-line fix? I can make a diff if it's
really necessary, I just don't possess a machine capable of compiling Mozilla.
Comment 15 User image Γριφεγ 2005-11-06 13:29:08 PST
*** Bug 314667 has been marked as a duplicate of this bug. ***
Comment 16 User image Alfred Kayser 2007-08-13 00:58:38 PDT
Better idea for this image viewing/imageDocument thing:
Present the image 'centered' (as least horizontally).
Current web2.0 style is to have content centered in the browser window, and makes thing much better adjusted to the various window sizes...
Comment 17 User image Boris Zbarsky [:bz] (still a bit busy) 2007-08-13 02:52:17 PDT
> Present the image 'centered' (as least horizontally).

Been suggested.  See the bugs on it.
Comment 18 User image Alfred Kayser 2007-08-13 03:14:29 PDT
I can find bug 337882 : When viewing an image-only page, the image should be centered. 

So may be we can mark one as 'DUP' of the other?
Comment 19 User image :aceman 2011-05-13 11:28:42 PDT
*** Bug 655594 has been marked as a duplicate of this bug. ***

Note You need to log in before you can comment on or make changes to this bug.