Open
Bug 322073
Opened 19 years ago
Updated 3 years ago
<img src="myimage.gif" valign="middle"> and rendering text in relation to image
Categories
(Core :: Layout, defect)
Tracking
()
UNCONFIRMED
People
(Reporter: xmarksthespot007, Unassigned)
Details
Attachments
(2 files)
User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.9a1) Gecko/20051230 Firefox/1.6a1
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.9a1) Gecko/20051230 Firefox/1.6a1
Lets say you have some text here and then small image <img src="myimage.gif" valign="middle" border="0"> and some text after image. In FF 1.07 valign="middle" seems to work as expected, but not anymore in FF 1.5 and FF 1.6a2. Valign="middle" was handy for example if you wanted to replace @ in an email address with an image of @...
Reproducible: Always
Comment 1•19 years ago
|
||
can you attach a testcase?
1. Upload your small gif using the link in the Attachment table above:
Create a New Attachment (proposed patch, testcase, etc.)
https://bugzilla.mozilla.org/attachment.cgi?bugid=322073&action=enter
2. copy the address of the attachment
3 [review]. use this address in your HTML
4. test if your HTML is working locally, using the gif downloaded from bugzilla
5. upload the HTML
6. test the uploaded HTML
of course you don't need to test if you are sure, I always test before and after submitting ;-)
Comment on attachment 207526 [details]
image of @-character
<html>
<body>
<p>Some text before the image<img src="https://bugzilla.mozilla.org/attachment.cgi?id=207526" align="middle">and some text after the image</p>
</body>
</html>
If was align="middle", not valign, bigger images seem to work ok in ff 1.5
Comment 4•19 years ago
|
||
testcase shows align="middle" and valign="middle", and 2nd set framed by a 4 pix thick yellow border
Updated•19 years ago
|
Severity: trivial → minor
Component: General → Layout
OS: Windows XP → All
Product: Firefox → Core
QA Contact: general → layout
Hardware: PC → All
Version: unspecified → 1.8 Branch
Comment 5•19 years ago
|
||
while searching for this bug i've come across a possible cause.
(without deeper understanding of the code) it looks at least suspicious.
bug 192077 attachment 193281 [details] [diff] [review]
- { "middle", NS_STYLE_VERTICAL_ALIGN_MIDDLE },//verified
+ { "middle", NS_STYLE_VERTICAL_ALIGN_MIDDLE_WITH_BASELINE },
the testcase attachment 193282 [details] also reproduces this bug 322073 on my FF 1.5.0.1
Comment 6•19 years ago
|
||
just checked that the current behaviour is correct according to the specs.
(there's no valign for img and align=middle is slightly different from css vertical-align:middle)
so this bug may well be closed as invalid.
however, i'd like to point out that the current behaviour of (v)align=middle breaks the compatibility (of the resulting html-layout) to at least one other widely used browser (ie6) and even mozilla (any version before the change).
Looks like this bug is the one I've found with this embedded CSS:
<a href="bla"><img src="bla.gif" alt="" style="vertical-align:middle; border:none; padding: 0px;" width="16" height="16" /> link text</a>
That's the result in IE 6.0 (top) and SeaMonkey 1.0.2 (bottom, Firefox 1.5.0.4 shows the same) (both marked):
http://img64.imageshack.us/img64/3995/alignmentproblem9zw.png
I assume IE shows it right.
Comment 8•19 years ago
|
||
although i can't really see the difference in the image, i think what rené is trying to show is that with vertical-align:middle
1) ie puts the img center at the vertical center of the font bounding box
2) moz puts the img center at the font baseline plus half the height of lowercase glyphs
moz (2) is correct according to the css specs, ie (1) is wrong
this bug is about the html attributes' interpretation, not about the css' interpretation. but two comments concerning this bug:
- comment 7 shows once more how handy (see comment 0) valign=middle was
- in fact it seems currently impossible (even with css) to reproduce ie's alignment with mozilla
Updated•3 years ago
|
Severity: minor → S4
You need to log in
before you can comment on or make changes to this bug.
Description
•