Why float?

**Spartanicus** · Jul 21 '05, 02:02 AM

Re: Why float?

"Wolfgang Meier" <womei@sofort-mail.de> wrote:
[color=blue]
>why is /float/ better than /position/?[/color]

Who says that it is, or that apples and pears can even be ranked in such
a better/worse classification?

Either usage for the purpose of creating a "CSS" layout is a second rate
choice, the least unsuitable method to create a "CSS" layout is a CSS
table. "Least unsuitable" since a CSS tables when used with CSS 2.x are
in themselves a poor tool to create a layouts suitable for the web, but
CSS 2.x offers no mechanism to create good quality web layouts.

People commonly use floats or positioning to create a "CSS" layout
because IE doesn't support CSS tables. Floating and positioning are
fundamentally unsuitable for creating a quality web layout, but they are
the only two CSS methods available if the code needs to work in IE. Both
methods create fundamental problems (bugs not included), these problems
should be extensively examined and weighed against the potential
advantage offering a semantically correct layout.

I say potential because the actual advantage of using an IE compatible
"CSS" layout instead of a HTML table is imagined in most cases, the
result of wishful thinking, and typically null in reality.

Using a "CSS" layout has become a badge of honour, bearers are exempt
from scorn being poured over them in newsgroups. Few of the
"enlightene d" souls with their CSS layouts are aware of the negative
effects of using such fundamentally unsuitable methods such as floating
and positioning for creating a layout.

--
Spartanicus

**Wolfgang Meier** · Jul 21 '05, 02:02 AM

Re: Why float?

Spartanicus wrote:[color=blue]
>Few of the "enlightene d" souls with their CSS layouts
> are aware of the negative effects of using such fundamentally
> unsuitable methods such as floating and positioning for creating a layout.[/color]

Interesting theory, please go into detail!

Anyway, the problem remains. I'm not looking for the best theoretically
possible solution but the "best" practical solution. To me, it seemed
like most authors regard /float/ing elements as the best practical
solution and I just wondered why.

**Spartanicus** · Jul 21 '05, 02:02 AM

Re: Why float?

"Wolfgang Meier" <womei@sofort-mail.de> wrote:
[color=blue][color=green]
>>Few of the "enlightene d" souls with their CSS layouts
>> are aware of the negative effects of using such fundamentally
>> unsuitable methods such as floating and positioning for creating a layout.[/color]
>
>Interesting theory, please go into detail![/color]

Both floated and positioned layout boxes fail to contain their content,
if that content doesn't fit in the layout box the content will either
overflow, be clipped, or cause scroll bars inside the viewport, none are
acceptable behaviour for a basic quality layout mechanism.

Clearing a float within a layout box positioned horizontally adjacent to
a floated layout box results in the non floated layout box to be moved
below the floated layout box. This can be hacked around, but floating as
a layout method has already failed another basic requirement: layout
boxes (and their content) should be isolated from content in other
layout boxes.

The content of an absolutely positioned box cannot be allowed to wrap if
there is another positioned box placed directly below it as it will
overlap the content of that box. Not allowing content to wrap causes
horizontal scroll bars, an unnecessary irk to impose on the user.

When abused to create a "layout", floating imposes restrictions on where
to place content on screen, and/or causes content order problems.

Both floating and positioning are incapable of creating a basic layout
format: columns that expand vertically interdependentl y depending on
their content.

The CSS float property was intended to replace the HTML align attribute.
It's intended and only proper usage is to move an element like an image
to one side and have text flow next and beneath it. All other uses are
fundamentally inappropriate hacks that cause the aforementioned
problems.
[color=blue]
>Anyway, the problem remains. I'm not looking for the best theoretically
>possible solution but the "best" practical solution.[/color]

Then use a HTML table, unless you are highly skilled with CSS, perfectly
understand the implications of a floated and/or positioned CSS layout,
and you can come up with a valid reason as to why using a HTML table
would be bad for your users (most unlikely), to such an extent that it
outweighs the disadvantages of positioned or floated CSS layouts.

The one exception to the above would be if the site's primary purpose is
for you to experiment with CSS to further your skills and/or
understanding of the technology.

--
Spartanicus

**Alan J. Flavell** · Jul 21 '05, 02:02 AM

Re: Why float?

On Tue, 28 Jun 2005, Spartanicus wrote:
[color=blue]
> Clearing a float within a layout box positioned horizontally
> adjacent to a floated layout box results in the non floated layout
> box to be moved below the floated layout box.[/color]

That's a benefit of using floating, indeed. When the proposed layout
is inappropriate to the available viewport, it adapts itself more
gracefully to what's available.
[color=blue]
> Both floating and positioning are incapable of creating a basic
> layout format:[/color]

I can't think of /any/ technique for "creating a basic layout format"
on a browser whose characteristics you as author aren't aware of (and
should not be taking any specific interest in at the time of serving
out the page). Forcing it too hard runs the risk of causing
left/right scrolling (something which readers report to be very
annoying, and I agree with them) or alternatively getting lines of
text with only a couple of words on them, cramped by adjacent columns
of clutter that are of no benefit in a restricted viewport width - or
when the reader needs an unusually large font.

As author, your job is to make presentation proposals, which may or
may not be useful to the recipient. I'll take it for granted that
you've designed it to do what you want in some mainstream browsing
situation: then, to my way of thinking, the interesting thing is what
it's going to do when the situation is far enough from that to make a
significant difference.

I recognise that some of the other technical points you made about CSS
implementation are correct, but on this rather important general point
I do think I have to disagree with you. One of the DISadvantages of
the table approach is that it "works" (in the sense of doing what the
author requested, instead of what would be more appropriate to the
presentation situation) even in situations where it's become
senseless.

**Spartanicus** · Jul 21 '05, 02:02 AM

Re: Why float?

"Alan J. Flavell" <flavell@ph.gla .ac.uk> wrote:
[color=blue][color=green]
>> Clearing a float within a layout box positioned horizontally
>> adjacent to a floated layout box results in the non floated layout
>> box to be moved below the floated layout box.[/color]
>
>That's a benefit of using floating, indeed. When the proposed layout
>is inappropriate to the available viewport, it adapts itself more
>gracefully to what's available.[/color]

The issue I described is an entirely one than boxes shifting below other
boxes as a result of unsufficient client viewport width.
[color=blue][color=green]
>> Both floating and positioning are incapable of creating a basic
>> layout format:[/color]
>
>I can't think of /any/ technique for "creating a basic layout format"
>on a browser whose characteristics you as author aren't aware of (and
>should not be taking any specific interest in at the time of serving
>out the page). Forcing it too hard runs the risk of causing
>left/right scrolling (something which readers report to be very
>annoying, and I agree with them) or alternatively getting lines of
>text with only a couple of words on them, cramped by adjacent columns
>of clutter that are of no benefit in a restricted viewport width - or
>when the reader needs an unusually large font.
>
>As author, your job is to make presentation proposals, which may or
>may not be useful to the recipient. I'll take it for granted that
>you've designed it to do what you want in some mainstream browsing
>situation: then, to my way of thinking, the interesting thing is what
>it's going to do when the situation is far enough from that to make a
>significant difference.
>
>I recognise that some of the other technical points you made about CSS
>implementati on are correct, but on this rather important general point
>I do think I have to disagree with you. One of the DISadvantages of
>the table approach is that it "works" (in the sense of doing what the
>author requested, instead of what would be more appropriate to the
>presentation situation) even in situations where it's become
>senseless.[/color]

I was specifically asked about the disadvantages of floated and or
positioned "CSS" layouts.

The suitability of grid based layouts is a different topic. I consider
the ability to work on an infinite number of viewport widths as an
essential requirement for web layouts. But a grid layout such as
established by a table need not be fixed, it can be redefined to form a
different configuration depending on the client's viewport width. Such a
mechanism is however not provided by CSS2.x, which is why I wrote: "CSS
2.x offers no mechanism to create good quality web layouts." The CSS3
proposals include such a mechanism (media queries) and has a rudimentary
implementation in Opera 7.2+. Used in conjunction with CSS tables (or
even HTML tables), an author could solve that particular problem.

Under CSS 2.x all we have is the handheld media type, which is woefully
inadequate since it fails to accommodate the wide range of viewport
widths and screen resolutions that are used.

That leaves unresolved the issue of separating content order and
placement on screen. I'm not aware of an intent by w3c to address this
elementary layout issue, or even of an awareness that it needs to be
addressed.

--
Spartanicus

**Stan McCann** · Jul 21 '05, 02:02 AM

Re: Why float?

"Wolfgang Meier" <womei@sofort-mail.de> wrote in
news:1119913881 .359950.50610@g 14g2000cwa.goog legroups.com:
[color=blue]
> Hi,
>
> Although it might seem like I am firing out random posts in quick
> succession this matter is indeed one I thought about for quite some
> time without coming to a conclusion:
>
> Why is it that most professional CSS authors prefer /float/ing
> elements[/color]

It works in most browsers.
[color=blue]
> over elements held in place by /position/?[/color]

It doesn't work in the most popular browser.
[color=blue]
>
> Given, for example, the following layout...
>
> +-----------------+
>| 1 |
> +---+-------------+
>| | |
>| 2 | 3 |
>| | |
> +---+-------------+
>
> ...with (1) having some known (say 5em) height and (2) having some
> known width (say 5em) I don't see why I should apply float to (2)
> and (3) instead of just positioning (3) to {+5em, +5em}.
>
> While trying to find the issue behind this, the more I read about
> /float/, the more workarounds, tricks and quirks necessary for
> broken CSS implementations I found -- so just why is /float/ better
> than /position/?[/color]

Speaking of broken implementations , try speaking to this guy I heard
about named Bill Gates. Maybe he could fix his browser?
[color=blue]
>
>
> Please enlighten me :-)[/color]

Have you ever looked at a page using position in IE? It isn't
(positioned that is).

--
Stan McCann "Uncle Pirate" http://stanmccann.us/pirate.html
Webmaster/Computer Center Manager, NMSU at Alamogordo
http://alamo.nmsu.edu/ There are 10 kinds of people.
Those that understand binary and those that don't.

**Spartanicus** · Jul 21 '05, 02:02 AM

Re: Why float?

Stan McCann <me@stanmccann. us> wrote:
[color=blue][color=green]
>> over elements held in place by /position/?[/color]
>
>It doesn't work in the most popular browser.[/color]

It's buggy, but usable, there are solutions to some of the IE
positioning bugs.

--
Spartanicus

**Stan McCann** · Jul 21 '05, 02:02 AM

Re: Why float?

Spartanicus <invalid@invali d.invalid> wrote in
news:sjt2c1pc37 lrse7qsjl52dobv g6u1h78dr@news. spartanicus.utv internet.ie
:
[color=blue]
> Stan McCann <me@stanmccann. us> wrote:
>[color=green][color=darkred]
>>> over elements held in place by /position/?[/color]
>>
>>It doesn't work in the most popular browser.[/color]
>
> It's buggy, but usable, there are solutions to some of the IE
> positioning bugs.
>[/color]

Hmm. I quit trying after a while of unsuccessfully trying to position
elements to work with IE. It's lack of support for CSS 2.1 is so bad
that I mostly stick with CSS 1.

--
Stan McCann "Uncle Pirate" http://stanmccann.us/pirate.html
Webmaster/Computer Center Manager, NMSU at Alamogordo
http://alamo.nmsu.edu/ There are 10 kinds of people.
Those that understand binary and those that don't.

**Spartanicus** · Jul 21 '05, 02:02 AM

Re: Why float?

Stan McCann <me@stanmccann. us> wrote:
[color=blue][color=green][color=darkred]
>>>> over elements held in place by /position/?
>>>
>>>It doesn't work in the most popular browser.[/color]
>>
>> It's buggy, but usable, there are solutions to some of the IE
>> positioning bugs.[/color]
>
>Hmm. I quit trying after a while of unsuccessfully trying to position
>elements to work with IE.[/color]

Successful use of CSS positioning requires considerable skills. Both CSS
and browsers have their failings, but I suggest that you leave judgement
and criticism of either to people who are sufficiently skilled with the
technology.

Otherwise you end up looking silly by making incorrect claims like the
above.

--
Spartanicus

**Jan Roland Eriksson** · Jul 21 '05, 02:02 AM

Re: Why float?

On Tue, 28 Jun 2005 19:17:01 GMT, Spartanicus <invalid@invali d.invalid>
wrote:
[color=blue]
>Stan McCann <me@stanmccann. us> wrote:[color=green]
>>Hmm. I quit trying after a while of unsuccessfully trying to
>>position elements to work with IE.[/color][/color]

Absolute positioning is not fit for web use in the first place.
My conclusion is that abs.pos. stuff is best saved for known output
media's like e.g. print on paper and/or projector presentations
[color=blue]
>Successful use of CSS positioning requires considerable skills.[/color]

Not really, if the presentation tool and media is known in advance;
ahhh...you mean on the www? yes of course. There's no need to use
positioning at all in www presentations.
[color=blue]
>Both CSS and browsers have their failings[/color]

So had old time typesetting, a standard grinding device was the ultimate
tool to use for printing perfect placement of certain lead casted
characters.

Still, I do accept CSS for what it has become today, in implements that
is. CSS2.1 is in "last call" at the moment (funny to see that the
/required/ test suit materialized that fast :-).

Could we just get 100% compliant implements of CSS2.1 we would have a
stable ground to stand on for future developments.

--
Rex

**Stan McCann** · Jul 21 '05, 02:02 AM

Re: Why float?

Spartanicus <invalid@invali d.invalid> wrote in
news:t273c1589h 3a5k729otk99tce b4tiob0dg@news. spartanicus.utv internet.ie
:
[color=blue]
> Stan McCann <me@stanmccann. us> wrote:
>[color=green][color=darkred]
>>>>> over elements held in place by /position/?
>>>>
>>>>It doesn't work in the most popular browser.
>>>
>>> It's buggy, but usable, there are solutions to some of the IE[/color][/color][/color]

My opinion: buggy = doesn't work.
[color=blue][color=green][color=darkred]
>>> positioning bugs.[/color]
>>
>>Hmm. I quit trying after a while of unsuccessfully trying to
>>position elements to work with IE.[/color]
>
> Successful use of CSS positioning requires considerable skills. Both[/color]

I have considerable skill. Do I have more to learn? Yes, as I'm sure
we all do.
[color=blue]
> CSS and browsers have their failings, but I suggest that you leave
> judgement and criticism of either to people who are sufficiently
> skilled with the technology.[/color]

The only one I see being critical and/or judgemental about anything is
you.
[color=blue]
>
> Otherwise you end up looking silly by making incorrect claims like
> the above.
>[/color]

I did not make an incorrect claim and I don't think I look silly about
saying something that IMO is true. Positioning does not "work" in IE.
If you have to "make it work" by finding some workaround, then it DOES
NOT WORK.

Agree or disagree, I don't care. And if you don't like what I say,
then just kf me. OTOH, if you show me something proving I'm incorrect,
I am always willing to learn and I have no problem admitting to
mistakes. Maybe that makes me look silly?

--
Stan McCann "Uncle Pirate" http://stanmccann.us/pirate.html
Webmaster/Computer Center Manager, NMSU at Alamogordo
http://alamo.nmsu.edu/ There are 10 kinds of people.
Those that understand binary and those that don't.

**Spartanicus** · Jul 21 '05, 02:02 AM

Re: Why float?

Stan McCann <me@stanmccann. us> wrote:
[color=blue][color=green][color=darkred]
>>>Hmm. I quit trying after a while of unsuccessfully trying to
>>>position elements to work with IE.[/color]
>>
>> Successful use of CSS positioning requires considerable skills.[/color]
>
>I have considerable skill.[/color]

Regarding the subject of this group your posts tell a different story.
[color=blue][color=green]
>> CSS and browsers have their failings, but I suggest that you leave
>> judgement and criticism of either to people who are sufficiently
>> skilled with the technology.[/color]
>
>The only one I see being critical and/or judgemental about anything is
>you.[color=green]
>>
>> Otherwise you end up looking silly by making incorrect claims like
>> the above.[/color]
>
>I did not make an incorrect claim and I don't think I look silly about
>saying something that IMO is true. Positioning does not "work" in IE.[/color]

Post a url with a minimized example so that we can see what you are on
about.

--
Spartanicus

**Lauri Raittila** · Jul 21 '05, 02:02 AM

Re: Why float?

in comp.infosystem s.www.authoring.stylesheets, Stan McCann wrote:[color=blue]
> Spartanicus <invalid@invali d.invalid> wrote in
> news:t273c1589h 3a5k729otk99tce b4tiob0dg@news. spartanicus.utv internet.ie
> :
>[color=green]
> > Stan McCann <me@stanmccann. us> wrote:
> >[color=darkred]
> >>>>> over elements held in place by /position/?
> >>>>
> >>>>It doesn't work in the most popular browser.
> >>>
> >>> It's buggy, but usable, there are solutions to some of the IE[/color][/color]
>
> My opinion: buggy = doesn't work.[/color]

With that logic:

Tables are buggy in IE. Tables don't work in IE.

HTTP is buggy in IE. WWW don't work with IE.
[color=blue][color=green][color=darkred]
> >>> positioning bugs.
> >>
> >>Hmm. I quit trying after a while of unsuccessfully trying to
> >>position elements to work with IE.[/color]
> >
> > Successful use of CSS positioning requires considerable skills. Both[/color]
>
> I have considerable skill.[/color]

When someone says you need considerable skills, he propably pretty much
means skill at least comparable his own. Spartanicus is way ahead you...
[color=blue][color=green]
> > CSS and browsers have their failings, but I suggest that you leave
> > judgement and criticism of either to people who are sufficiently
> > skilled with the technology.[/color]
>
> The only one I see being critical and/or judgemental about anything is
> you.[/color]

Spartanicus has considerable skills. You state something about equal to
"WWW does not work" and think it is not judgemental/critical...

And I am bit sceptic as well. IMHO, floats and positioning are very good
layout tools. But they are totally unsuitable for stuff which tables are
good, and they don't solve many problems in design that I have all the
time.

And the fact that they are supported so poorly means that you shouldn't
use them too much for complex cases if you don't know. Just like you
ignore lots of the fun stuff in html table.

The difference is that support for tables in ingremental, IE supports
rest at least as much as it. In case of CSS, IE supports again least, but
it is not guaranteed that every other browser supports same stuff, or
same way.
[color=blue]
> I did not make an incorrect claim and I don't think I look silly about
> saying something that IMO is true. Positioning does not "work" in IE.
> If you have to "make it work" by finding some workaround, then it DOES
> NOT WORK.[/color]

Positioning works to some extend in IE. You don't always need tricks. But
if you try to do something more complicated, then you need the tricks.
There is things that just can't be done using tables, and using
positioning or floats is better option than forcing table layout. (trough
you can make float layout using tables and get it work on NN2,
practically no-one does.)

Usually, reson why beginner fails on positioning has absolutely nothing
to do with support for positioning to IE, but failure to understand how
it works.

--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Kohtuuhintainen yksiö/huone haussa Oulusta syyskuusta eteenpäin.
Searching places to sleep on axis Bonn - Tsech - Poland - baltic sea in
july

**Steve Pugh** · Jul 21 '05, 02:02 AM

Re: Why float?

Stan McCann wrote:[color=blue]
> Have you ever looked at a page using position in IE? It isn't
> (positioned that is).[/color]

I can only assume that you're talking about position: fixed; as IE
supports position: absolute; and position: relative; relatively (sorry)
well.

http://www.stevepugh.net/VTT/ uses both relative and absolute
positioning (and floats) and the shortcomings in IE compared to other
browsers are down to IE's failure to support max-width and some float
bugs rather than any failure to support positioning (oh, and some
wierdness wrt .ico files).

Steve

Why float?

Why float?

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment