Displaying a scrollable table with fixed head?

[kchayka]

Re: Displaying a scrollable table with fixed head?

Michael Schuerig wrote:[color=blue]
>
> <http://www.schuerig.de/michael/layout/list.html2>.
> At least Firefox displays this as intended (although the horizontal
> scrollbar isn't very fetching); Konqueror (Safari?) doesn't display any
> text in the table body :-O[/color]

It's highly unlikely that you'll get a cross-browser scrolling tbody, at
least not for a few years yet.

--
Reply email address is a bottomless spam bucket.
Please reply to the group so everyone can share.

[Gus Richter]

Re: Displaying a scrollable table with fixed head?

Michael Schuerig wrote:[color=blue]
> Some time after posting the URL above I uploaded a (even more) broken
> version of the stylesheet, thus you might have seen that.
> [Re: superfluous border declarations]
>
> There is only one table.[/color]

You replaced previous versions instead of adding a new version, so I
can't check if it was my bad vision or your error.
[color=blue]
> Okay. If I really *must* define the scrollable height, i.e. it's not
> enough to set it implicitly by defining the bottom, then I won't be
> able to get what I'd like to have: A scrollable table with fixed head,
> anchored some distance from the bottom (and possibly left and right)
> edge of the window.[/color]

How else is it going to know the size of the scrollable window for tbody
without declaring the height?
RE: anchoring from the bottom:
If you want bottom, use it and not top. If your latest is

http://www.schuerig.de/michael/layout/list2.html

then your style2.css rules for table should be changes to provide what
you probably want, like so:
Remove: top: 5em; left: 0;
Replace with: bottom:0;
Your "mainbody" is offset from the bottom by 20px so positioning the
table with bottom:0; will abut the bottom of the table with the top of
your status section. Also, left:0; is superfluous since it is the default.
[color=blue]
> I'm not doing this to annoy you or anyone else, but please have a look
> at the layout again:
> <http://www.schuerig.de/michael/layout/list.html>[/color]

For the above's style.css no scrollable height is declared for tbody.
Indeed no height for anything at all.
[color=blue]
> As bad as that is already, with a fixed table height it wouldn't work at
> all; see
> <http://www.schuerig.de/michael/layout/list.html2>.[/color]

For: http://www.schuerig.de/michael/layout/list2.html !!!
style2.css has height declared for tbody and it works.
[color=blue]
> At least Firefox displays this as intended (although the horizontal
> scrollbar isn't very fetching);[/color]

The vertical scrollbar is inside the table itself, so part of the real
estate for the last cells in tbody is used. If the content in the last
cell extends the full width, the last portion could/would be hidden by
the vertical scrollbar, so a horizontal scrollbar is there to be able to
scroll horizontally in order to look behind the vertical scrollbar. Not
the best - it could have been made to appear only if the text in any of
the last cells is wide enough, but there it is.
[color=blue]
> Konqueror (Safari?) doesn't display any
> text in the table body :-O[/color]

Don't know, but I do know that Opera and IE do not support overflow. You
may wish to consider your whole approach if you intend to support them all.

--
Gus

[Michael Schuerig]

Re: Displaying a scrollable table with fixed head?

Gus Richter wrote:
[color=blue]
> Michael Schuerig wrote:[color=green]
>> Some time after posting the URL above I uploaded a (even more) broken
>> version of the stylesheet, thus you might have seen that.
>> [Re: superfluous border declarations]
>>
>> There is only one table.[/color]
>
> You replaced previous versions instead of adding a new version, so I
> can't check if it was my bad vision or your error.[/color]

Most likely it was my error. I experimented with with some of the files
in my local staging area and they got uploaded when I didn't think of
it.
[color=blue][color=green]
>> Okay. If I really *must* define the scrollable height, i.e. it's not
>> enough to set it implicitly by defining the bottom, then I won't be
>> able to get what I'd like to have: A scrollable table with fixed
>> head, anchored some distance from the bottom (and possibly left and
>> right) edge of the window.[/color]
>
> How else is it going to know the size of the scrollable window for
> tbody without declaring the height?[/color]

If top as well as bottom are defined the height simply is given by the
height of the enclosing container minus those two distances. The same
goes for all enclosing containers up to the window. When I started out,
I thought this was so obvious that it got me by surprise when it didn't
work.
[color=blue]
> For: http://www.schuerig.de/michael/layout/list2.html !!!
> style2.css has height declared for tbody and it works.[/color]

Yes, I know and I knew it before I even asked. The thing is -- that's
not what I want. You can't always get what you want, yes I know that,
too.
[color=blue][color=green]
>> Konqueror (Safari?) doesn't display any
>> text in the table body :-O[/color]
>
> Don't know, but I do know that Opera and IE do not support overflow.
> You may wish to consider your whole approach if you intend to support
> them all.[/color]

As I wrote before:
[color=blue]
> I'm not married to that specific layout, I'd instantly ditch it for
> something that's clearly better. My own imagination is currently
> blocked and I can't think of anything better, but pleasy, anyone, go
> ahead.[/color]

Michael

--
Michael Schuerig They tell you that the darkness
mailto:michael@ schuerig.de Is a blessing in disguise
http://www.schuerig.de/michael/ --Janis Ian, From Me To You

[Gus Richter]

Re: Displaying a scrollable table with fixed head?

Michael Schuerig wrote:[color=blue]
> If top as well as bottom are defined the height simply is given by the
> height of the enclosing container minus those two distances. The same
> goes for all enclosing containers up to the window. When I started out,
> I thought this was so obvious that it got me by surprise when it didn't
> work.[/color]

Well, in this instance it is the scrollable window size of tbody which
is a part of body, from which it takes its width. In my opinion it is
unreasonable to expect to have a different width from table, for thead,
tbody and/or tfoot.
HTML 4.01 does not permit the width attribute for tbody and CSS 2.1
states that the width property applies to "all elements but non-replaced
inline elements, table rows, and row groups", which I believe
incorporates tbody.
[color=blue]
> The thing is -- that's
> not what I want.
>[color=green]
>>I'm not married to that specific layout, I'd instantly ditch it for
>>something that's clearly better. My own imagination is currently
>>blocked and I can't think of anything better, but pleasy, anyone, go
>>ahead.[/color][/color]

You either go with bleeding edge for fancy stuff and wait for other
browsers to catch up or fall back to conventional display and methods.

BTW, do you realize that your css tool throws in an orphan ( } ) closing
curly brace at the end of your stylesheets?

--
Gus

[Michael Schuerig]

Re: Displaying a scrollable table with fixed head?

Gus Richter wrote:
[color=blue]
> Michael Schuerig wrote:[color=green]
>> If top as well as bottom are defined the height simply is given by
>> the height of the enclosing container minus those two distances. The
>> same goes for all enclosing containers up to the window. When I
>> started out, I thought this was so obvious that it got me by surprise
>> when it didn't work.[/color]
>
> Well, in this instance it is the scrollable window size of tbody which
> is a part of body, from which it takes its width. In my opinion it is
> unreasonable to expect to have a different width from table, for
> thead, tbody and/or tfoot.[/color]

I'm not sure I can follow you here. I'm mostly concerned with the table
(actually tbody) height. Regarding the width, yes, I've set it on thead
and tbody. That was not derived in any way from a CSS spec, but by
trial, error, and seeing what works in Firefox and Konqueror.

I'd like to point out that with both of these browsers, I get the tbody
(but not thead) exactly the way I want it: anchored at fixed distances
from the top and bottom of the window, flush left and right. And
additionally, the column widths look good, i.e., the columns are as
wide as dictated by their content, not forcibly stretched to the entire
table width.

I may be violating all kinds of things in the specs. If this is the
case, IMNSHO, the specs (and browsers) need fixing. The resulting
layout I'm trying to get *should* be allowed and easy. But as things
stand, the layout does not work due to the column width inconsistencies
-- thus I'm not tempted to violate the specs.
[color=blue]
> You either go with bleeding edge for fancy stuff and wait for other
> browsers to catch up or fall back to conventional display and methods.[/color]

I agree wholeheartedly that it is bleeding edge. Fancy? No.
[color=blue]
> BTW, do you realize that your css tool throws in an orphan ( } )
> closing curly brace at the end of your stylesheets?[/color]

Actually, no, I don't realize this, although my "css tool" -- myself
armed with an editor -- is pretty fallible. Right now I can find no
surplus "}", but I may well have put in one or another in the past.

Michael

--
Michael Schuerig This is not a false alarm
mailto:michael@ schuerig.de This is not a test
http://www.schuerig.de/michael/ --Rush, Red Tide

[Gus Richter]

Re: Displaying a scrollable table with fixed head?

Michael Schuerig wrote:[color=blue]
> Gus Richter wrote:
>[color=green]
>>Michael Schuerig wrote:
>>[color=darkred]
>>>If top as well as bottom are defined the height simply is given by
>>>the height of the enclosing container minus those two distances. The
>>>same goes for all enclosing containers up to the window. When I
>>>started out, I thought this was so obvious that it got me by surprise
>>>when it didn't work.[/color]
>>
>>Well, in this instance it is the scrollable window size of tbody which
>>is a part of body, from which it takes its width. In my opinion it is
>>unreasonabl e to expect to have a different width from table, for
>>thead, tbody and/or tfoot.[/color]
>
> I'm not sure I can follow you here. I'm mostly concerned with the table
> (actually tbody) height. Regarding the width, yes, I've set it on thead
> and tbody. That was not derived in any way from a CSS spec, but by
> trial, error, and seeing what works in Firefox and Konqueror.[/color]

Sorry, I jumped ahead of my thoughts. What I was thinking was that by
using coordinates (top, left, bottom, right - which you say does not
work and which I believe is not permitted) you are defining the height
_as well as_ the width (if bottom would work, so would right). You can
define the width of td and the table, but you cannot define the width of
tr, thead, tbody or tfoot. By this I was trying to reason as to why
coordinates do not work for tbody and that you must use the height
property for tbody to specify its scrollable height.
[color=blue]
> I'd like to point out that with both of these browsers, I get the tbody
> (but not thead) exactly the way I want it: anchored at fixed distances
> from the top and bottom of the window, flush left and right. And
> additionally, the column widths look good, i.e., the columns are as
> wide as dictated by their content, not forcibly stretched to the entire
> table width.[/color]

Your problem was with tbody, which is ok now.
Now your undefined problem is with thead?
[color=blue]
> I may be violating all kinds of things in the specs. If this is the
> case, IMNSHO, the specs (and browsers) need fixing. The resulting
> layout I'm trying to get *should* be allowed and easy. But as things
> stand, the layout does not work due to the column width inconsistencies
> -- thus I'm not tempted to violate the specs.[/color]

Now you say you have a problem with column width inconsistencies ?
Have you tried specifying th and td widths?

--
Gus

[Michael Schuerig]

Re: Displaying a scrollable table with fixed head?

Gus Richter wrote:
[color=blue]
> Michael Schuerig wrote:[/color]
[color=blue][color=green]
>> I'd like to point out that with both of these browsers, I get the
>> tbody (but not thead) exactly the way I want it: anchored at fixed
>> distances from the top and bottom of the window, flush left and
>> right. And additionally, the column widths look good, i.e., the
>> columns are as wide as dictated by their content, not forcibly
>> stretched to the entire table width.[/color]
>
> Your problem was with tbody, which is ok now.
> Now your undefined problem is with thead?[/color]

You can allocate the problem where you want. I get either a table where
the tbody is exactly as I want it, but its colums are not aligned with
the columns in the thead. Or I can get a table where thead and tbody
columns are aligned perfectly, but the tbody is not how I want it.
[color=blue][color=green]
>> I may be violating all kinds of things in the specs. If this is the
>> case, IMNSHO, the specs (and browsers) need fixing. The resulting
>> layout I'm trying to get *should* be allowed and easy. But as things
>> stand, the layout does not work due to the column width
>> inconsistencies -- thus I'm not tempted to violate the specs.[/color]
>
> Now you say you have a problem with column width inconsistencies ?
> Have you tried specifying th and td widths?[/color]

Yes, sort of. I can't manually fix the widths beforehand as the layout
is intended to be used in generated pages where I may not even know how
many columns there are, much less how wide they ought to be. The
browsers are much better at determining an appropriate width, or
whether to show scroll bars, than I am.

I've tried to compute the common column width in a JavaScript as the max
of the corresponding tbody and thead column widths. Somewhat inspired
by <http://www.quirksmode. org/js/fixedhead.html> . They still don't line
up perfectly, apparently due to browser quirks regarding how the
various widths are interpreted.

Michael

--
Michael Schuerig Nothing is as brilliantly adaptive
mailto:michael@ schuerig.de as selective stupidity.
http://www.schuerig.de/michael/ --A.O. Rorty, The Deceptive Self

[Gus Richter]

Re: Displaying a scrollable table with fixed head?

Michael Schuerig wrote:[color=blue]
> Gus Richter wrote:
>[color=green]
>>Michael Schuerig wrote:[/color]
>
> You can allocate the problem where you want.[/color]

I didn't allocate. I just capsulated/reviewed.
[color=blue][color=green]
>>Now you say you have a problem with column width inconsistencies ?[/color]
>
> Yes, sort of.[/color]

It works very well if done properly! See:
<http://www.home.golden .net/~richterf/Michael/Special.html>
for an example. Make modifications to your preference. You have to
search out your problem in your code yourself. If you can't find your
problem, start the table afresh without the height/overflow declaration
for tbody and if it looks ok, then add them in. Sectionalize and
minimize your work to simplify debugging and then work backwards or
start afresh.

--
Gus

[Michael Schuerig]

Re: Displaying a scrollable table with fixed head?

Gus Richter wrote:
[color=blue]
> See:
> <http://www.home.golden .net/~richterf/Michael/Special.html>
> for an example.[/color]

Thanks! I'll see how to put the pieces together for my purpose.

Michael

--
Michael Schuerig Face reality and stare it down
mailto:michael@ schuerig.de --Jethro Tull, Silver River Turning

http://www.schuerig.de/michael/

[Gus Richter]

Re: Displaying a scrollable table with fixed head?

Michael Schuerig wrote:[color=blue]
> Gus Richter wrote:
>
>[color=green]
>>See:
>> <http://www.home.golden .net/~richterf/Michael/Special.html>
>>for an example.[/color]
>
>
> Thanks! I'll see how to put the pieces together for my purpose.[/color]

This DOM2 cross-browser method might interest you:

<http://www.gtalbot.org/HTMLJavascriptC SS/ScrollingTBody. html>

--
Gus

[Michael Schuerig]

Re: Displaying a scrollable table with fixed head?

Gus Richter wrote:
[color=blue]
> Michael Schuerig wrote:[color=green]
>> Gus Richter wrote:
>>
>>[color=darkred]
>>>See:
>>> <http://www.home.golden .net/~richterf/Michael/Special.html>
>>>for an example.[/color]
>>
>>
>> Thanks! I'll see how to put the pieces together for my purpose.[/color]
>
> This DOM2 cross-browser method might interest you:
>
> <http://www.gtalbot.org/HTMLJavascriptC SS/ScrollingTBody. html>[/color]

Thanks for pointing me there. Interesting. I must admit that I don't yet
understand how it works. Anyway, I've gone to a simpler layout with
moving table head.

Michael

--
Michael Schuerig Nothing is as brilliantly adaptive
mailto:michael@ schuerig.de as selective stupidity.
http://www.schuerig.de/michael/ --A.O. Rorty, The Deceptive Self