286942 - Page displays wrong: uses a drop cap which is out of place on the page

Status: RESOLVED INVALID

(Core :: Layout, defect)

Description

[Jack Eden]

User-Agent:       Mozilla/5.0 (Windows; U; Win98; en-US; rv:1.7.6) Gecko/20050225 Firefox/1.0.1
Build Identifier: Mozilla/5.0 (Windows; U; Win98; en-US; rv:1.7.6) Gecko/20050225 Firefox/1.0.1

On the page, the author used <span class="dropcap-large"> to create a drop cap
t.  This did not display correctly when I viewed the page.  The letter should be
displayed at the top left of the column of text, with the other text flowing
around it.  Instead it was displayed down underneath the column of text.

Reproducible: Always

Steps to Reproduce:
1.Load the page
2.Look at the first paragraph of the article.
3.

Actual Results:  
The page was displayed wrong, as described above.

Expected Results:  
Displayed the letter in the right place, with text surrounding it.

Comment 1

[Ben Fowler]

Mozilla/5.0 (Macintosh; U; PPC Mac OS X Mach-O; en-US; rv:1.8b2) Gecko/20050227
Firefox/1.0+

I am not sure that I can see the problem. Do you have a shorter testcase?

Comment 2

[Jackie]

(In reply to comment #0)
Any chance you can find a web page where this happens that doesn't require us to
make an account? Going to the webpage you specified leads me to a 'create
account' herald.com page rather than the article specified. 

Or perhaps you could post a screenshot of the page where this is happening.

Comment 3

[Mathias Wittlock]

Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8b4) Gecko/20050908 (No
IDN) Firefox/1.4

Still seeing this bug in 1.5b1. After inspecting the HTML I've found that the
problem is cause by the following two lines of CSS:
FLOAT: left;
WIDTH: 5pt;
The problem seems to be that text doesn't float around a larget letter or just
that the 5pt width is far less then I think it is. Removing the WIDTH attribute
will make it looks just as in IE (which I guess is what the webdesigner wanted)
without changing the appearance there. I'm guessing this one is either an issue
with the WIDTH but more likely the cause of a bad web design (ie. Invalid)

Someone with some more knowledge of this, have a look at the minimal test case
(increased font-size were left there so it's more obvious what happens) and
decide if this should go as NEW or INVALID.

Comment 4

[Mathias Wittlock]

Attachment: Minimal testcase based off supplied link.

Comment 5

[Ben Fowler]

Attachment: Test case with a possibly acceptable render

Camino 0000000000 (v0.9a2+)

Do you have an image of a correct render? 

I enclose a test case which appears to render as I would expect a drop
cap implemented like this.

Comment 6

[Mathias Wittlock]

(In reply to comment #5)

What you posted is pretty much what the supplied link looks like in Internet
Explorer (and thus what the designer of that page most likely was looking for).

Question remains though if it's just sloppy webdesign (which still turns out
"right" in IE) or bad interpretation of the CSS in Firefox.

Comment 7

[Daniel.S]

(In reply to comment #6)
> Question remains though if it's just sloppy webdesign (which still turns out
> "right" in IE) or bad interpretation of the CSS in Firefox.

With the site gone (well, reorganized), we can mostly guess.
If the code was the same as in the first testcase, it definitely was a authoring mistake.