RE: CSS not enough - Re: proposal for HTML4.01 amendment: <BR PAGEBREAK="before">

Hello Robert,

> -----Original Message-----
> ----- Original Message -----
> From: "Christian Wolfgang Hujer" <Christian.Hujer@itcqis.com>
>
> <snip/>
>
> > But tables are quite useful, especially for tables, though even I often
> > abuse them for layout purposes due to the lack of other possibilities.
> > (I know that I could do everything I do with tables with CSS
> instead, but
> I
> > also know that most browsers cannot display it)
>
> this is not true :)
>
> there are serious problems using CSS only to layout a page.
> - you have to do kludgy workarounds to get a 3 column layout[1]
this is not true ;)

> --- you need to use absolute positioning
this is not true ;)

> --- why do you want 3 (or more) columns? becuase you want to get
> information 'above the fold' (like a newspaper)
yes and this is no problem :)

> - you cannot do a decent layout with more than 3 columns (that
> is, where the two outer columns are fixed and the inner columns vary on
browser width).
this is no problem :)

> - if you do a 2 or 3 column layout you need to use font-sizes set to px so
> the user cannot resize text, otherwise it will eventually overlap
> the other columns if sized-up.
this is not true :)

> The only way to create a page that is 'usable' by a wide audience
> is to use tables!
that is true and that's what I said.

> Tables allow larger text to wrap without overlapping and allow
> however many columns you want. Sure it is lay out, but how would you do
> these types of layout with CSS and keep them usable?

They are not usable, and that's what I said:
> > (I know that I could do everything I do with tables with CSS
> > instead, but I also know that most browsers cannot display it)
> best,
> -Rob
>
> [1] kludgy css for 3 column layout
>
> #body_left_column {
> position: absolute;
> left:5px;
> top:50px;
> width:190px;
> border:0px solid #eaeaea;
> background-color:#EDEDED;
>  }
>
> #body_center_column {
> margin-left: 204px;
> margin-right:204px;
> border:0px solid #eaeaea;
> voice-family: "\"}\"";
> voice-family: inherit;
> margin-left: 206px;
> margin-right:206px;
>  }
> html>body #body_center_column {
> margin-left: 206px;
> margin-right:206px;
>  }
>
> #body_right_column {
> position: absolute;
> right:10px;
> top:50px;
> width:180px;
> border:0px solid #eaeaea;
> background-color:#EDEDED;
>  }


what about:
.firstColumn {
	left:0%;
	right:75%;
}
.secondColumn {
	left:25%;
	right:50%;
}
.thirdColumn {
	left:50%;
	right:25%;
}
.forthColumn {
	left:75%;
	right:0%;
}
.firstColumn, .secondColumn, .thirdColumn, .forthColumn {
	position:absolute;
}
this is shorter, 4 columns, relative layout, font size independant and works
fine in Opera 6, Mozilla and Internet Explorer 6 (other browsers not yet
tested). Problem: flow of objects following the forth column is broken (like
in your solution).


or what about:
.firstColumn, .secondColumn, .thirdColumn, .forthColumn {
	width:25%;
	float:left;
}
this is even shorter, 4 columns, relative layout, font size independant and
also works fine in Opera 6, Mozilla and Internet Explorer 6 (other browsers
not yet tested).
The advantage over the first solution is that following parts of the
document are in normal flow and do not cause layout problems because no
absolute positioned elements were used.

And I am sure I could find even more solutions. The reason why I do not use
them often is that tables still provide a more stable solution.


These solutions still have one problem, which the but share with tables:
text doesn't automatically flow from one column into another.



Greetings

Christian

Received on Saturday, 12 January 2002 08:39:57 UTC