278643 - div:first-letter{font-weight:800;} generates line height and alignment problems

Status: RESOLVED EXPIRED

(SeaMonkey :: General, defect)

Description

[Dan]

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.0; fr; rv:1.8a6+) Gecko/20050111
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.0; fr; rv:1.8a6) Gecko/20050111

Mozilla/5.0 (Windows; U; Windows NT 5.0; fr; rv:1.8a6) Gecko/20050111
introduced  alignment and line height problems in a few pages for example at
http://danzcontrib.free.fr/pagecss.php
after a few tests, it is caused by the rule
#content div:first-letter
{
font-weight:800;
}
line 400 in the css file http://danzcontrib.free.fr/css/style_old_nn4.css


Reproducible: Always

Steps to Reproduce:
1.connect to http://danzcontrib.free.fr/pagecss.php
2.
3.

Actual Results:  
alignment and height problems

Expected Results:  
apply the rule div:first-letter{font-weight:800;} without modifying the layout

Comment 1

[Gérard Talbot]

Can you identify/specify precisely what are the alignment and line-height
problems? As far as I can say, I see nothing special at the provided url with
Mozilla 1.8b build 2005011505 under XP Pro SP2.

Can you create a reduced testcase? If necessary, an you upload a screenshot of
the problem?

Comment 2

[Dan]

Attachment: screenshot showing the problem

Comment 3

[Dan]

screenshot.png uploaded shows what I get on the screen with
Mozilla/5.0 (Windows; U; Windows NT 5.0; fr; rv:1.8a6) Gecko/20050111

you will find a reduced testcase
http://danzcontrib.free.fr/pagecss4b.php with
#content div:first-letter{
font-weight:800;
}
and a page without the rule
http://danzcontrib.free.fr/pagecss4.php

Comment 4

[Gérard Talbot]

> screenshot.png uploaded shows what I get on the screen with
> Mozilla/5.0 (Windows; U; Windows NT 5.0; fr; rv:1.8a6) Gecko/20050111

You've uploaded a screenshot without indicating, illustrating where were those
line-height and alignment problems that you see. The small differences I can see
relate to positioning of nested divs which are styled with as many as 5
different classes. Such small differences could be related to rounding up of
divisions. Regarding the line-height problem, your screenshot does not indicate
how/where there is some kind of problem.

> you will find a reduced testcase
> http://danzcontrib.free.fr/pagecss4b.php with
> #content div:first-letter{
> font-weight:800;
> }

Your so-called reduced testcase webpage has 26 divs, nested divs; your css has
21 css rules and some 65 declarations with well over 40 of them which can
influence positioning and text alignment. Do you think you have really provided
a reduced testcase which can help isolate a precise bug on alignment? which can
help identify and confirm alignment and line-height problems you see? which can
help fix a possible bug?

What is a Simplified Test Case, and How Do I Make One?
http://www.mozilla.org/newlayout/bugathon.html#testcase
Example of a reduced testcase: attachment 145920 [details]

Please read this document carefully before adding any more comments:
http://groups-beta.google.com/group/netscape.public.mozilla.layout/browse_thread/thread/4b44ff47ef062b20?hl=en&lr=&ie=UTF-8&oe=UTF-8&frame=right&seekm=bphc6u%24u11%40ripley.netscape.com#link1

Finally, if there are 2 distinct, separate, distinguishable layout problems,
then there should be 2 distinct, separate bugfiles written+opened accordingly.

Comment 5

[Dan]

I reduced my so-called test page, I don't know if it's enough
http://danzcontrib.free.fr/pagecss4b.php
so that Mozilla/5.0 (Windows; U; Windows NT 5.0; fr; rv:1.8a6) Gecko/20050111
modifies the layout
if you remove line-height in the rule .tiers2 or if you remove div:first-letter

Comment 6

[Dan]

I did some more reducing and testing.
http://danzcontrib.free.fr/pagecss4c.php
http://danzcontrib.free.fr/pagecss4d.php
http://danzcontrib.free.fr/pagecss4e.php
I don't know if it can help but while
<div class="tiers2">A</div>
<div class="tiers2">A</div> or <div class="tiers2">1</div>
shows no problem,
replacing 1 or A by a (lower-case letter) modifies the layout if I dont remove
line-height or div:first-letter
but it depends on the letter: b doesn't cause a modification (see
http://danzcontrib.free.fr/pagecss4e.php or
http://danzcontrib.free.fr/pagecss4f.php)

Comment 7

[Gérard Talbot]

Attachment: Inaccurate positioning due to rounding up of computed width

This testcase is about the first problem: horizontal alignment of floated
<div>s.

There is a small (1px) gap, spacing between 2nd and 3rd div or an 1px overlap
of borders. Resize the width of your browser to see the gap or overlap.
Rounding up of computed width will position the 3rd div sometimes 1px too far,
sometimes 1px too short. DOM inspector will report the fractional values of
width of divs.

Even when the size of <div>s are in absolute length, there is still a rounding
up possible.

Comment 8

[Gérard Talbot]

Dan, there are clearly 2 distinct, separate problems or issues with your
description so far. 

The rounding up of computed width therefore defining the positioning (±1px) of
an nth floated <div> has nothing to do with pseudo-class first-letter.

The line-height issue is a distinct one. For reasons I do not know, if the
element has no height defined, then the computed height will vary (as reported
by DOM inspector: ±2px) when setting the line-height; this variation does not
happen in MSIE 6 SV1 nor in Opera 8.00 beta1.

Right now, it's time to search for possible duplicates regarding both
issues/problems and if you can't find a duplicate, then open another bugfile
with a clear summary, steps to reproduce, reduced testcase.

Comment 9

[Dan]

Attachment: lower/upper case letters affect line height in floated divs

The rounding problem does not break the layout but the way lower-case letters
are treated (a,c,e,g,... vs b,d,f,h,...) does.
The fact that previous versions (up to 1.8a6) were not affected made me think
that there was 1 problem.
I will try to attach 2 test cases. Do you think I should open new bugfile(s) ?

Comment 10

[Dan]

Attachment: fferent line heights for upper-case and lower-case letters in floated divs

Comment 11

[Gérard Talbot]

Dan, right now, there is 1 summary, 1 description, 4 testcases, several urls
which have changed, 10 comments and what appears to be 2 distinct layout bugs.

> Do you think I should open new bugfile(s) ?

I already said 
> if there are 2 distinct, separate, distinguishable layout problems,
> then there should be 2 distinct, separate bugfiles written+opened accordingly.

I think you should read (if you haven't already)
Bug writing guidelines
http://www.mozilla.org/quality/bug-writing-guidelines.html

Once you're pretty sure there is no duplicate for each of these 2 bugs, then
re-summarize accordingly this bug and then open up another bug for the other
problem. The goal is to help out the eventual developer who is going to fix this
specific and well-defined bug or these 2 specific and well-defined bugs. Adding
more comments in this bugfile will not help.

Regarding line-height, if the height of the <div> is not defined, then it seems
that the height established by text defines the height of the block; I could be
wrong here. 
Most sentences, words use several letters with different descent (p, q, g, j),
different vertical stem width (Ê, À), etc..

Comment 12

[Gervase Markham [:gerv]]

This is an automated message, with ID "auto-resolve01".

This bug has had no comments for a long time. Statistically, we have found that
bug reports that have not been confirmed by a second user after three months are
highly unlikely to be the source of a fix to the code.

While your input is very important to us, our resources are limited and so we
are asking for your help in focussing our efforts. If you can still reproduce
this problem in the latest version of the product (see below for how to obtain a
copy) or, for feature requests, if it's not present in the latest version and
you still believe we should implement it, please visit the URL of this bug
(given at the top of this mail) and add a comment to that effect, giving more
reproduction information if you have it.

If it is not a problem any longer, you need take no action. If this bug is not
changed in any way in the next two weeks, it will be automatically resolved.
Thank you for your help in this matter.

The latest beta releases can be obtained from:
Firefox:     http://www.mozilla.org/projects/firefox/
Thunderbird: http://www.mozilla.org/products/thunderbird/releases/1.5beta1.html
Seamonkey:   http://www.mozilla.org/projects/seamonkey/

Comment 13

[Gervase Markham [:gerv]]

This bug has been automatically resolved after a period of inactivity (see above
comment). If anyone thinks this is incorrect, they should feel free to reopen it.