Open Bug 292859 Opened 20 years ago Updated 2 years ago

Vertical spacing rendered improperly in anchor tags embedded in ul li tags when font is set to small or x-small in css

Categories

(Core :: Layout, defect)

Product:
Core
Component:
Layout
Type:
defect

Tracking

()

People

(Reporter: frank.wierzbicki, Unassigned)

Details

(Whiteboard: DUPEME)

Attachments

(5 files, 1 obsolete file)

reporter's testcase
941 bytes, text/html
Details
screenshot zoomed 200%, 800x600
3.61 KB, image/png
Details
testcase with border on <a>
985 bytes, text/html
Details
testcase, no font size specified
990 bytes, text/html
Details
2nd testcase, zoomed 675%
4.18 KB, image/png
Details 
User-Agent:       Mozilla/5.0 (Macintosh; U; PPC Mac OS X Mach-O; en-US; rv:1.7.6) Gecko/20050317 Firefox/1.0.2
Build Identifier: Mozilla/5.0 (Macintosh; U; PPC Mac OS X Mach-O; en-US; rv:1.7.6) Gecko/20050317 Firefox/1.0.2

When the font is set to "small" or "x-small" in css and you have html like the
following:

<html>
    <head>
    <style>
       a { font-size:x-small }
    </style>
    </head>
    <body>
          <ul>
            <li>
                <a>Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah
Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah
Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah
Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah
Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah
Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah
Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah
Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah
Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah
Blah Blah Blah.</a>
            </li>
        </ul>
    </body>
</html>

The last line is rendered further away from the second to last line compared to
other lines.

Reproducible: Always

Steps to Reproduce:
1. Set font to small or x-small on <a> tags in css
2. make a <ul><li><a> tag with text that will span more than one line.

Actual Results:  
The list is rendered improperly (the last line has too much space above it)

Expected Results:  
It should have the same vertical distance between lines.
Really you can only see this bug if the text spans 3 lines (not 2 like I
reported above.)
Confirmed on 1.0.3 under XP sp2. Even tried a couple of doctypes and valid
html+css and the same seems to occur. the previous lines spacing is normal,
while the very last gets an extra 2-3px between the previous to last line.
Also noted: If window is resized smaller in width, this appears as well not only
on the last line, but the first line exactly how the last line appears. The
inner lines appear normal.
Component: General → Layout
Product: Firefox → Core
QA Contact: general → layout
Version: unspecified → 1.7 Branch
Attached file reporter's testcase — 
Also seen on Mozilla/5.0 (Windows; U; Win98; en-US; rv:1.8b2) Gecko/20050504
Attached file testcase with border on <a> (obsolete) — 
<style>
       a { font-size:x-small }
	   a { border: 1px solid red !important }
    </style>
 
borders of the inner lines are joined, borders of the outer lines are separate.
Comment on attachment 182666 [details]
testcase with border on <a>

<html>
    <head>
    <style>
       a { font-size:x-small }
	   a { border: 1px solid red !important }
    </style>
    </head>
    <body>
	  <ul>
	    <li>
		<a>Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah
Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah
Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah
Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah
Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah
Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah
Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah
Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah
Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah
Blah Blah Blah.</a>
	    </li>
	</ul>
    </body>
</html>
Attachment #182666 - Attachment filename: 292859.png → 292859-1.html
<style>
       a { font-size:x-small }
	   a { border: 1px solid red !important }
    </style>
Attachment #182666 - Attachment is obsolete: true
<style>
	   a { border: 1px solid red !important }
    </style>
You've got to zoom the testcase without font-size very high to see separate
borders, but even then there is no different spacing between inner and outer
lines.
Mozilla/5.0 (Windows; U; Win98; en-US; rv:1.8b2) Gecko/20050504 

Bug also seen on windows and trunk, not only Mac and Branch.

To see what is going on load the testcasees with borders, and use Ctrl++ to zoom.
The testcase without font specified has a very small distance between borders of
neighboring lines, seen only at high zoom factors.
The tescase of this bug, x-small font specified, seems to behave same way except
the borders between outer and inner lines, they have a bigger distance as seen
between borders of inner lines.
Severity: trivial → minor
Status: UNCONFIRMED → NEW
Ever confirmed: true
OS: MacOS X → All
Version: 1.7 Branch → Trunk
Hardware: Macintosh → All
I suspect this is a duplicate (I recall a bug on the first-line thing for list
items; it happened because the list bullet has a bigger font size and is in that
line).
Whiteboard: DUPEME
Severity: minor → S4
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: