Clearing floaters in Mozilla

#1 August 20th, 2005, 02:15 AM

Hello

Consider the following simple piece of HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html style="width: 100%; height: 100%">
<body style="width: 100%; height: 100%">

<div style="width: 200px; height: 200px; background-color: #000; float: left"></div>
<p>Test</p>

<div style="background-color: #ccc; clear: all">Test</div>

</body>
</html>

In IE 6 the 'clear' property in the second <div> appears to work, i.e. the
second <div> is placed below the first one. In Mozilla 1.7.8 it is placed to the
right from the first <div>, i.e. it looks like the second <div>'s 'clear'
property is completely ignored.

Why is this happening? Which browser is behaving correctly? And if Mozilla's
behavior is correct, then what's is the proper way to clear the floaters by
using CSS properties?

I know that <br clear="all"> will work in Mozilla, but it has its own issues and
also I'd like to be able to do it through CSS properties.

--
Best regards,
Andrey

#2 August 20th, 2005, 02:15 AM

Andrey Tarasevich wrote:[color=blue]
> ...
> Consider the following simple piece of HTML
>
> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
> "http://www.w3.org/TR/html4/strict.dtd">
>
> <html style="width: 100%; height: 100%">
> <body style="width: 100%; height: 100%">
>
> <div style="width: 200px; height: 200px; background-color: #000; float: left"></div>
> <p>Test</p>
>
> <div style="background-color: #ccc; clear: all">Test</div>
>
> </body>
> </html>
>
> In IE 6 the 'clear' property in the second <div> appears to work, i.e. the
> second <div> is placed below the first one. In Mozilla 1.7.8 it is placed to the
> right from the first <div>, i.e. it looks like the second <div>'s 'clear'
> property is completely ignored.
> ...[/color]

Oops, sorry. I can already see my mistake. In CSS it should be "clear: both". IE
mislead me by accepting "clear: all" variant.

--
Best rergards,
Andrey

#3 August 20th, 2005, 06:25 AM

In article <11gd0ad3rclt34a@news.supernews.com>, andreytarasevich@hotmail.com
says...[color=blue]
>
>
>Hello
>
>Consider the following simple piece of HTML
>
><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
>"http://www.w3.org/TR/html4/strict.dtd">
>
><html style="width: 100%; height: 100%">
><body style="width: 100%; height: 100%">
>
><div style="width: 200px; height: 200px; background-color: #000; float:
>left"></div>
><p>Test</p>
>
><div style="background-color: #ccc; clear: all">Test</div>
>
></body>
></html>
>
>In IE 6 the 'clear' property in the second <div> appears to work, i.e. the
>second <div> is placed below the first one. In Mozilla 1.7.8 it is placed to[/color]
the[color=blue]
>right from the first <div>, i.e. it looks like the second <div>'s 'clear'
>property is completely ignored.
>
>Why is this happening? Which browser is behaving correctly? And if Mozilla's
>behavior is correct, then what's is the proper way to clear the floaters by
>using CSS properties?
>
>I know that <br clear="all"> will work in Mozilla, but it has its own issues[/color]
and[color=blue]
>also I'd like to be able to do it through CSS properties.[/color]

If you're using Windows, you should stick with IE because it was created for
Windows. Don't mess with Mozilla or Netscape. If you insist on using a
different browser, try Opera (but it still doesn't beat IE).

--
Fly Cooter
http://fly-cooter.tripod.com

#4 August 20th, 2005, 07:35 AM

With neither quill nor qualm, Fly Cooter quothed:
[color=blue][color=green]
> >I know that <br clear="all"> will work in Mozilla, but it has its own issues[/color]
> and[color=green]
> >also I'd like to be able to do it through CSS properties.[/color]
>
> If you're using Windows, you should stick with IE because it was created for
> Windows. Don't mess with Mozilla or Netscape. If you insist on using a
> different browser, try Opera (but it still doesn't beat IE).[/color]

That's bullshit. Sure, Mozilla has problems and plenty of them but IE
has a class of greater-magnitude problems that shouldn't be extant. The
message prior to this original is a perfect example of what happens when
IE tries to "compensate" for faulty markup.

--
Neredbojias
Contrary to popular belief, it is believable.

#5 August 20th, 2005, 10:55 AM

On Fri, 19 Aug 2005, Fly Cooter wrote:
[color=blue]
> If you're using Windows, you should stick with IE because it was
> created for Windows.[/color]

Don't change your posting address, you clearly don't have the remotest
clue. About anything much, if you think that a choice of OS rules out
the use of third party applications!
[color=blue]
> Don't mess with Mozilla or Netscape. If you insist on using a
> different browser, try Opera (but it still doesn't beat IE).[/color]

This very thread reminds us that IE rules itself out as a
web-compatible browser by disregarding mandatory requirements
of the interworking protocol.

Bye.

#6 August 20th, 2005, 11:35 AM

begin quotation
from Fly Cooter <fly_cooter_@example.com>
in message <1124510635.ae80b85928741163a84fd52500d9f461@bubba news>[color=blue]
> In article <11gd0ad3rclt34a@news.supernews.com>, andreytarasevich@hotmail.com
> says...[color=green]
>> In IE 6 the 'clear' property in the second <div> appears to work,
>> i.e. the second <div> is placed below the first one. In Mozilla 1.7.8
>> it is placed to the right from the first <div>, i.e. it looks like
>> the second <div>'s 'clear' property is completely ignored.
>>
>> Why is this happening? Which browser is behaving correctly? And if
>> Mozilla's behavior is correct, then what's is the proper way to clear
>> the floaters by using CSS properties?
>>
>> I know that <br clear="all"> will work in Mozilla, but it has its own
>> issues and also I'd like to be able to do it through CSS properties.[/color]
>
> If you're using Windows, you should stick with IE because it was created for
> Windows. Don't mess with Mozilla or Netscape. If you insist on using a
> different browser, try Opera (but it still doesn't beat IE).[/color]

Absolutely terrible advice. Internet Explorer has more holes in it than
Swiss cheese, and fails miserably to implement many standards properly
(most notably, CSS, HTML, HTTP, and PNG).

There are reasons why Windows versions of Mozilla and Opera exist; the
one I can think of right off-hand is so one person can use the same
browser on multiple operating systems. There is no native, currently
maintained version of Internet Explorer for GNU/Linux and other GNU
variants, OpenBSD, NetBSD, FreeBSD, Solaris, AIX, HP/UX, MacOS 9, MacOS
X, IRIX, and, for that matter, just about every other operating system
out there *not* made by Microsoft.

--
___ _ _____ |*|
/ __| |/ / _ \ |*| Shawn K. Quinn
\__ \ ' < (_) | |*| skquinn@speakeasy.net
|___/_|\_\__\_\ |*| Houston, TX, USA

What is Bytes?

Popular Articles