87246 - Text appears to flow out of TD element

Status: RESOLVED WORKSFORME

(Core :: Layout, defect)

Description

[Chris Petersen]

Build : 2001062108
Platform: All
Expected result: Text should fit inside td element.
What I got: Portion of text flows out of TD element.

Steps to reproduce:

1) Go to http://netbusiness.netscape.com/

2) Notice the following text flow outside of TD : 

How did Tony Volchok Painting get a bid ?  With a free Netbusiness Card
Get customers with a free Netbusiness Card

3) This data is contained inside of td.

<td BGCOLOR=#E0E099>
<perf:timeit name="body.psp -- hpbizcard">
<div STYLE="width:245;height:53;overflow:hidden;z-index:0;"><div
STYLE="margin-left:7px;"><span CLASS=heading>Net Paint: </span>How did Tony
Volchok Painting <a
HREF="http://info.netscape.com/fwd/sbitoprow.1/http://netbusiness.netscape.com/card/featuredcard.psp">get
a &#036;4,000 bid</a>?  With a free Netbusiness Card</div>
<div STYLE="margin-left:17px;margin-top:5px;">-- Get customers with a <a
HREF="http://info.netscape.com/fwd/sbitoprow.2/http://netbusiness.netscape.com/?NB_PROMO_CODE=0002">free
Netbusiness Card</a></div></div>
</perf:timeit>
</td>

Comment 1

[GavinS]

If it helps any, if you shrink the width of mozilla window enough, the data
mentioned in the previous comment (the TD data) is displayed fine, and there is
no overlapping.

If you slowly expand the width of the mozilla window, then you see that at some
stage, the text starts escaping from it's TD cell

Comment 2

[Chris Petersen]

Revised summary

Comment 3

[Chris Petersen]

Yes, I noticed that resizing the window small enough will resolve problem. It
just looks bad when the window is at a normal size.

Comment 4

[GavinS]

In a mo, I'll attach a simpler test case. Note:

1) I added a dtd to please the w3c validator. The only thing the validator
doesn't like now is the <perf> tag

2) The original page doesn't like the w3c validator much at all :)

3) I'm not sure that what is happening is necessarily wrong, or a bug, but
hopefully this test case will allow someone more knowledgable to determine that.
(Which is the whole point!)

4) With this test case, you can remove the outer <div>, the inner <div> or the
<perf>, and in each case, the problem does not show itself..

I hope this helps.....

Comment 5

[GavinS]

Attachment: simpler test case

Comment 6

[Chris Petersen]

CCing Lisa on this issue. If there is something we can fix in the HTML , perhaps
she can help. 

Comment 7

[Chris Petersen]

BTW, the layout of text in td is displayed fine in N4.7 (Mac) and IE 5.1.1 (Mac)

Comment 8

[lchiang]

cc: to evangelism team.   Is there something that can be done on the page to
correct the problem?

Comment 9

[Bob Clary [:bc] (inactive)]

The problem is due to the inappropriate xml tags left from the server side
processing. If you remove or comment out the <perf:timeit> starting and ending
tag the issue is resolved.  I would think that we should ignore such unknown
tags, but that is not the case here.

<perf:timeit name="body.psp -- hpbizcard">
<DIV STYLE="width:245;height:53;overflow:hidden;z-index:0;"><DIV
STYLE="margin-left:7px;"><SPAN CLASS=heading>Net Paint: </SPAN>How did Tony
Volchok Painting <A
HREF="http://info.netscape.com/fwd/sbitoprow.1/http://netbusiness.netscape.com/card/featuredcard.psp">get
a &#036;4,000 bid</a>?  With a free Netbusiness Card</DIV>

<DIV STYLE="margin-left:17px;margin-top:5px;">-- Get customers with a <A
HREF="http://info.netscape.com/fwd/sbitoprow.2/http://netbusiness.netscape.com/?NB_PROMO_CODE=0002">free
Netbusiness Card</A></DIV></DIV>
</perf:timeit>

Comment 10

[GavinS]

NB: Removing either of the 2 pairs of <divs> also removes the problem, is that
important?

Also, is it correct that there is a table, with 2 rows, each with one <TD>, and
they get laid out horizontally? (This is because of the ROWSPAN=3 on the first
<TD>, and my understanding of what should happen here is maybe wrong, but it
just seems odd.)

Comment 11

[anthonyd]

WORKSFORME.