User-Agent: Mozilla/5.0 (Macintosh; U; PPC Mac OS X Mach-O; en-US; rv:1.7) Gecko/20040531 Firefox/0.8.0+ Build Identifier: Mozilla/5.0 (Macintosh; U; PPC Mac OS X Mach-O; en-US; rv:1.7) Gecko/20040531 Firefox/0.8.0+ The <BR CLEAR="ALL"> tag is supposed to skip down until after whatever IMG tag that has been ALIGN'd LEFT or RIGHT is rendered. Firefox does this just fine, unless the image is inside of an ordered list tag and a LI element has been encountered. The result is that the BR tag is ignored, and the page renders incorrectly in Firefox, but not other browsers. (This makes perfect sense when you see the code in action.) Reproducible: Always Steps to Reproduce: This works: <UL><LI><IMG ALIGN="RIGHT">...<BR CLEAR="ALL"></UL> However in this example, the BR tag is ignored! <UL><LI><IMG ALIGN="RIGHT">...<LI>...<BR CLEAR="ALL"></UL> Actual Results: Since the BR tag is ignored, code like this ends up stacking images until they roll off the left side of the screen: <UL> <LI><IMG ALIGN="RIGHT">... <LI>... <LI>...<BR CLEAR="ALL"> <LI><IMG ALIGN="RIGHT">... <LI>... <LI>...<BR CLEAR="ALL"> <LI><IMG ALIGN="RIGHT">... <LI>... <LI>...<BR CLEAR="ALL"> </UL> Expected Results: The software should have honored the BR tag, skipping down the page. As you see in the sample URL, which was validated by an HTML validator as correct, it makes it difficult to put multiple instructional bullet points by a single image. What I suspect is happened is that the image is considered to be inside the list element: <LI><IMG/></LI> This is explains why a break also works when it, too, is inside the list element: <LI><IMG ALIGN="RIGHT"/><BR CLEAR="ALL"/></LI> However, when a break occurs outside the context of the list element that contains the image, the "context" is lost, and therefore it renders with no effect: <LI><IMG ALIGN="RIGHT"/></LI><LI><BR CLEAR="ALL"/></LI> The BR tag in the second list element should be aware that a graphic element is being rendered to the right, and therefore should break when encountered. All other browsers I've tried this on render the page as expected. I know of no other way to render a graphic with a subset of list elements down the left side.
-> browser dup of Bug 163110?
Assignee: bugs → nobody
Component: Tabbed Browser → Layout: Floats
Product: Firefox → Browser
QA Contact: firefox.tabbed-browser → core.layout.floats
Version: unspecified → Trunk
My vote is that this is NOT a duplicate. The issue in bug 163110 is that images stack to the left, as well they should left to their own devices. The issue in this bug is that when you issue the command <BR CLEAR="ALL"> which is supposed to be the HTML for resolving the behavior reported in bug 163110, it doesn't work. <BR CLEAR="ALL"> is supposed to say "please advance the page to the point beyond the image's height so that it won't stack [as shown in 163110]."
I don't see any differences between how Mozilla displays the page and how Opera displays it.
(In reply to comment #3) > I don't see any differences between how Mozilla displays the page and how Opera > displays it. Very curious; while I *love* Firefox, it even behaves as I described on Windows. I tried it with the latest Opera, latest Internet explorer, and latest Firefox. I've posted some screen shots so you can see side-by-side comparison, along with a picture of how I think the HTML tree is parsing things, resulting in an explation for the observations. http://www.wwco.com/~wls/MOZILLABUG/BUG247213.html
It doesn't look anything remotely like that for me.
This was fixed by bug 148994 (the clear was being ignored since the <li> didn't overlap the float due to the float-edge styles). *** This bug has been marked as a duplicate of 148994 ***
Status: UNCONFIRMED → RESOLVED
Last Resolved: 14 years ago
Resolution: --- → DUPLICATE
You need to log in before you can comment on or make changes to this bug.