By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
443,694 Members | 1,845 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 443,694 IT Pros & Developers. It's quick & easy.

always visible colunmn headers

P: n/a
In a spreadsheet you can arrange that column headers are always
visible no matter how much your scroll the table itself. What is the
best way to get this effect in CSS?. Does it require frames or is
there a better way?

--
Bush crime family lost/embezzled $3 trillion from Pentagon.
Complicit Bush-friendly media keeps mum. Rumsfeld confesses on video.
http://www.infowars.com/articles/us/...s_rumsfeld.htm

Canadian Mind Products, Roedy Green.
See http://mindprod.com/iraq.html photos of Bush's war crimes
Jul 21 '05 #1
Share this Question
Share on Google+
15 Replies


P: n/a
On Tue, 28 Jun 2005 02:15:06 GMT, Roedy Green <lo*****@mindprod.com.invalid>
wrote:
In a spreadsheet you can arrange that column headers are always
visible no matter how much your scroll the table itself. What is the
best way to get this effect in CSS?. Does it require frames or is
there a better way?


Someone will offer a pure CSS way.

I use tables and do it this way:

#topBar { POSITION: fixed; POSITION: expression("absolute");
TOP: 0em; TOP: expression(parseInt(document.body.scrollTop +0));

<div id="topBar">
Frontal Lobe<sup>(R)</sup>&nbsp;&nbsp;Home Page
</div>

( you can tinker with the "0" -- someone here worried about it )

See it working at:

http://masonc.home.netcom.com

Mason C
Jul 21 '05 #2

P: n/a
Roedy Green wrote:
In a spreadsheet you can arrange that column headers are always
visible no matter how much your scroll the table itself. What is the
best way to get this effect in CSS?. Does it require frames or is
there a better way?


<http://www.home.golden.net/~richterf/Michael/Special.html>
Requires a Gecko based browser to view properly (overflow:auto; applied
to tbody).

--
Gus
Jul 21 '05 #3

P: n/a
In article <Hq********************@golden.net>,
Gus Richter <gu********@netscape.net> wrote:
Roedy Green wrote:
In a spreadsheet you can arrange that column headers are always
visible no matter how much your scroll the table itself. What is the
best way to get this effect in CSS?. Does it require frames or is
there a better way?


<http://www.home.golden.net/~richterf/Michael/Special.html>
Requires a Gecko based browser to view properly (overflow:auto; applied
to tbody).


Any suggestion as to how to get rid of that stupid horizontal scrollbar?

--
= Eric Bustad, Norwegian bachelor programmer
Jul 21 '05 #4

P: n/a
Roedy Green wrote :
In a spreadsheet you can arrange that column headers are always
visible no matter how much your scroll the table itself. What is the
best way to get this effect in CSS?. Does it require frames or is
there a better way?

Cross-browser scrolling tbody:
http://www.gtalbot.org/HTMLJavascrip...lingTBody.html

Gérard
--
remove blah to email me
Jul 21 '05 #5

P: n/a
"Roedy Green" wrote :
In a spreadsheet you can arrange that column headers are always
visible no matter how much you scroll the table itself. What is the
best way to get this effect in CSS?. Does it require frames or is
there a better way?


Assuming your purpose is to display data and not to hack a layout,
the only CSS-based implementation I have confidence in that:
1) works in the most common Windows browsers
2) does not involve extra tables or frames
3) does not involve turgid JavaScripts
4) prints well with repeating headers and footers
5) is drop-tested in production environments over several years

is this one:

http://web.tampabay.rr.com/bmerkey/e...le-header.html
Jul 21 '05 #6

P: n/a
Eric Kenneth Bustad wrote:

Any suggestion as to how to get rid of that stupid horizontal scrollbar?


What I have done is to place the tbody content inside a table, placed
this table inside a div and placed the div inside tbody. I removed
overflow:auto from tbody and applied it to the div. The div then is
scrollable instead of tbody and presents only a vertical scrollbar.
These changes worked for me:

tbody {height: 10em;}

<tbody>
<tr><td colspan="3">
<div style="height:10em;overflow:auto;">
<table style="width:100%;">
tbody content
</table>
</div>
</td></tr>
</tbody>

The cell widths need to be defined to equal their width for the two tables.

--
Gus
Jul 21 '05 #7

P: n/a
In article <Nu********************@golden.net>,
Gus Richter <gu********@netscape.net> wrote:
Eric Kenneth Bustad wrote:

Any suggestion as to how to get rid of that stupid horizontal scrollbar?


What I have done is to place the tbody content inside a table, placed
this table inside a div and placed the div inside tbody. I removed
overflow:auto from tbody and applied it to the div. The div then is
scrollable instead of tbody and presents only a vertical scrollbar.
These changes worked for me:

tbody {height: 10em;}

<tbody>
<tr><td colspan="3">
<div style="height:10em;overflow:auto;">
<table style="width:100%;">
tbody content
</table>
</div>
</td></tr>
</tbody>

The cell widths need to be defined to equal their width for the two tables.


Well, yes, it is pretty easy if one is willing to set the column
widths explicitly. One *would* often prefer not to do that.

--
= Eric Bustad, Norwegian bachelor programmer
Jul 21 '05 #8

P: n/a
On Tue, 28 Jun 2005 02:15:06 GMT, Roedy Green <lo*****@mindprod.com.invalid>
wrote:
In a spreadsheet you can arrange that column headers are always
visible no matter how much your scroll the table itself. What is the
best way to get this effect in CSS?. Does it require frames or is
there a better way?


This question seems to appear frequently. I suspect it's fear of
javascript that keeps it alive.

http://masonc.home.netcom.com has what you want.

Javascript calculations are active even though javascript is set OFF
in the browser. At least that's the way it seems to me.

The trick is:

#topBar { POSITION: fixed; POSITION: expression("absolute");
TOP: 0em; TOP: expression(parseInt(document.body.scrollTop +0));

(don't flame me for the "0" -- play with it if you wish)

Mason C
Jul 21 '05 #9

P: n/a
Eric Kenneth Bustad wrote:
The cell widths need to be defined to equal their width for the two tables.


Well, yes, it is pretty easy if one is willing to set the column
widths explicitly. One *would* often prefer not to do that.


You don't have to. Try the code I have given and you will note that it
performs as you asked; without the horizontal scrollbar.

The line about the cell widths was an after thought. If you try my demo
and incorporate the code mentioned, you will note that the columns for
the two tables do not line up. It's up to you if you are satisfied with
that.

--
Gus
Jul 21 '05 #10

P: n/a
I would like to set up a webpage on the internet does any one have any advise on how to
go about doing this. I know how to read and write html and know a little about css as it
relates to the previous. To I need to open a account for a ftp and what do I do to make
sure I can protect other peoples privacy. Since last time that I used lynx which had come
packaged with my Global Village modem I see that there are alot of changes including the
complexity of the pogram itself.I know a little bit about both html and css and how to write
code as well as how to read it. Can I set up a free ftp and if so where? Please feel free
to write me at my e-mail address.
Jul 21 '05 #11

P: n/a
On Tue, 28 Jun 2005 03:23:51 -0400, Gus Richter
<gu********@netscape.net> wrote or quoted :
<http://www.home.golden.net/~richterf/Michael/Special.html>
Requires a Gecko based browser to view properly (overflow:auto; applied
to tbody).


That's interesting. The catch is in IE it looks dreadful. I have a
similar problem. I have customers with nojava, crappy Java and recent
java engines installed. I really should somehow be showing them
different html, at least for part of a page.

--
Bush crime family lost/embezzled $3 trillion from Pentagon.
Complicit Bush-friendly media keeps mum. Rumsfeld confesses on video.
http://www.infowars.com/articles/us/...s_rumsfeld.htm

Canadian Mind Products, Roedy Green.
See http://mindprod.com/iraq.html photos of Bush's war crimes
Jul 21 '05 #12

P: n/a
On Tue, 28 Jun 2005 18:47:56 -0400, Gérard Talbot
<ne***********@gtalbot.org> wrote or quoted :
Cross-browser scrolling tbody:
http://www.gtalbot.org/HTMLJavascrip...lingTBody.html


Unfortunately that page fails in opera 8.0.1. I have reported it.

--
Bush crime family lost/embezzled $3 trillion from Pentagon.
Complicit Bush-friendly media keeps mum. Rumsfeld confesses on video.
http://www.infowars.com/articles/us/...s_rumsfeld.htm

Canadian Mind Products, Roedy Green.
See http://mindprod.com/iraq.html photos of Bush's war crimes
Jul 21 '05 #13

P: n/a
Roedy Green wrote:

That's interesting. The catch is in IE it looks dreadful.


By applying the changes which I posted (workaround), by placing another
table inside a div and the div inside tbody, it looks and works ok for
IE and Opera as well. Additionally, IE requires TR height in the
embedded table.

Opera has been aware of this overflow:auto problem since several
versions ago.

--
Gus
Jul 21 '05 #14

P: n/a
On Thu, 30 Jun 2005 18:53:22 GMT, http://ww**************@yahoo.com
wrote or quoted :
I would like to set up a webpage on the internet does any one have any advise on how to
go about doing this. I know how to read and write html and know a little about css as it
relates to the previous. To I need to open a account for a ftp and what do I do to make
sure I can protect other peoples privacy. Since last time that I used lynx which had come
packaged with my Global Village modem I see that there are alot of changes including the
complexity of the pogram itself.I know a little bit about both html and css and how to write
code as well as how to read it. Can I set up a free ftp and if so where? Please feel free
to write me at my e-mail address.


Normally you let some ISP set that up for you. there are free ones.

See my list http://mindprod.com/jgloss/isp.html
To find a utility to let you upload files see
http://mindprod.com/jgloss/ftp.html

IF you don't know how to compose html, you can learn it pretty easily
just from the html cheat sheet. see
http://mindprod.com/jgloss/htmlcheat.html

It will point you to some tutorials.

You get your webpages working so that you can browse and link between
them on your local site. when it is all as you wish, you upload the
lot to your ISP.

The hard part is getting your CSS style sheets to work. see
http://mindprod.com/jgloss/css.html for resources to help there.

I am just about to start trying out Dreamweaver, which is what many
people are using to compose. I just use a text editor and my own macro
generator for intelligent boilerplate.


--
Bush crime family lost/embezzled $3 trillion from Pentagon.
Complicit Bush-friendly media keeps mum. Rumsfeld confesses on video.
http://www.infowars.com/articles/us/...s_rumsfeld.htm

Canadian Mind Products, Roedy Green.
See http://mindprod.com/iraq.html photos of Bush's war crimes
Jul 21 '05 #15

P: n/a
On Tue, 28 Jun 2005 23:37:10 GMT, "Brett Merkey"
<bm*****@tampabay.rr.com> wrote or quoted :
http://web.tampabay.rr.com/bmerkey/e...le-header.html


in opera, the headers still scroll, but at least table is usable.

This is an elegant solution, no messy markup. Magically all your
tables can start behaving this way.
--
Bush crime family lost/embezzled $3 trillion from Pentagon.
Complicit Bush-friendly media keeps mum. Rumsfeld confesses on video.
http://www.infowars.com/articles/us/...s_rumsfeld.htm

Canadian Mind Products, Roedy Green.
See http://mindprod.com/iraq.html photos of Bush's war crimes
Jul 21 '05 #16

This discussion thread is closed

Replies have been disabled for this discussion.