Left-floating anchor elements with nested divs behave weirdly depending on size of HTML file




Layout: Floats
13 years ago
9 years ago


(Reporter: Timwi, Unassigned)


({qawanted, testcase})

Windows XP
qawanted, testcase

Firefox Tracking Flags

(Not tracked)



(4 attachments)



13 years ago
User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.6) Gecko/20050225 Firefox/1.0.1 StumbleUpon/1.9992
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.6) Gecko/20050225 Firefox/1.0.1 StumbleUpon/1.9992

I will attach a test case in a moment. This is an HTML which consists of:
1) a small CSS declaration at the top
2) a big HTML comment with loads of x's in it
3) 10 identical(!) copies of an <a> element with two identical <div>s in each.

AT MOST ONE of the 10 <a> elements is displayed as if the two divs were in
separate <a>s, but they're not. The other 9 elements, or sometimes all 10, are
displayed correctly. Reloading the exact same file sometimes switches between
correct and incorrect display.

WHICH ONE of the 10 elements is displayed incorrectly, and in what proportion of
successive reloads there is an incorrect element at all, depends on the CSS
declaration, the size of the HTML comment with the x's, the use of whitespace in
the file, whether or not the file is loaded as a local file or via an Apache
server, and the phases of the moon.

Reproducible: Sometimes

Steps to Reproduce:

Comment 1

13 years ago
Created attachment 177352 [details]
Test case

This is the test case. Remember that I said that it does not always trigger the
bug. Loading it here in BugZilla may not trigger the bug (I can't try that
before uploading it). If this does not trigger it, please download the file and
place it into the document root of an Apache server running on your localhost.
This is assuming the bug does not depend on the humidity of the air you are

Comment 2

13 years ago
Created attachment 177353 [details]
Test case - screenshot

*sigh* Of course the attachment didn't trigger the bug, just as I expected.

So I'm attaching here a screenshot of what the test case displays like for me,
when I view the file through a local installation of Apache.

One subtle detail about my original bugreport was inaccurate. I said that the
element that is rendered incorrectly renders as two elements. Actually, it
renders as five elements, only two of which contain text. You can see the
little 2x2-pixel blobs in the screenshot which are empty left-floating divs
with a 1px red border.

Comment 3

13 years ago
Created attachment 177354 [details]
Test case - screenshot (2)

Same test case, same situation, but smaller window size. Notice how the first
of the five "wrong" elements is in the first row, the other 4 in the second.

Comment 4

13 years ago
This is invalid HTML, you know?

<a class='test_case'>
   Some text
   Some text

(Inline-element a must not contain block-element div)

tschüs, jürgen
That it's invalid HTML is not relevant to the bug.  If a layout bug shows up
with invalid HTML it probably shows up with valid HTML too.

Comment 6

13 years ago
Mozilla/5.0 (Macintosh; U; PPC Mac OS X Mach-O; en-US; rv:1.8b2) Gecko/20050227

Thank you for the report. I can't reproduce from

1) Bugzilla
2) file
3) local Apache Server

Any other hints?

Comment 7

13 years ago
I don't know if this helps, but I've just discovered something interesting. When
the bug does occur, and then I use File/Save Page As, and I choose "Web page,
complete", then the file is significantly changed in such a way that the deviant
display could be regarded as correct.

Notice that it still affects only ONE of the ten <a>s-with-<div>s, even though
they are all identical. Again, WHICH one of the ten is affected depends, among
other things, on the HTML comment in the file as well as the amount of whitespace.

The original version is:
            <a class="test_case">
                    Some text
                    Some text

The version modified by File/Save Page As is:
            <a class="test_case">
<a class="test_case">                    Some text
<a class="test_case">                </a><div>
<a class="test_case">                    Some text
<a class="test_case">            </a>

Kind of makes sense if it's trying to somehow transform it into valid HTML.
Also, it now becomes obvious why there are five floating elements, two of which
contain text. But it's still bizarre that it does that to only one of the ten
identical elements.
Would be good to have a testcase that reliably shows the problem....
Keywords: qawanted
Created attachment 178688 [details]

Using <script></script> in the divs makes the bug appear reliably.
I think this is a duplicate of bug 273543.
Yeah, almost certainly.
Depends on: 273543


13 years ago
Keywords: testcase

Comment 11

9 years ago
Boris is right, but I'm duping this to bug 324875 because that's the bug that's about fixing this issue.
Last Resolved: 9 years ago
Resolution: --- → DUPLICATE
Duplicate of bug: 324875
You need to log in before you can comment on or make changes to this bug.