Solution! Alternating table row colors (fun with CSS Expressions)

[Matt Kruse]

http://www.mattkruse.com/temp/css_expressions.html

One of the standard CSS questions is "how can I shade every other table row
a different color with CSS?"

The answers are usually 1) you can't (yet), 2) put a class on every other
tr, or 3) use javascript to do the styling for you.

Well, I've been playing the CSS expressions quite a bit lately and I've
found a much simpler solution which works in IE5.5+, using "expressions". If
you're creating a web app that uses exclusively IE, or if you want to add
this feature for the majority of site visitors (using IE), then you can use
the technique in the url above. At that url are some other fun things that
CSS expressions can do also.

I realize the CSS expressions are non-standard and not a solution which
everyone will find acceptable. But for those that can accept the limited
browser support (IE only) then they are quite powerful and convenient. On
projects where IE is the only browser being used to access the web app, this
is going to be a great solution for me, I think. And in the future, as CSS
evolves and browsers support more advanced selectors, the CSS file can be
changed simply without needing to change anything in the content.

Thoughts?

--
Matt Kruse
http://www.JavascriptToolbox.com

[C A Upsdell]

"Matt Kruse" <ne********@mattkruse.com> wrote in message
news:ch*********@news2.newsguy.com...

http://www.mattkruse.com/temp/css_expressions.html

One of the standard CSS questions is "how can I shade every other table
row
a different color with CSS?"

The answers are usually 1) you can't (yet), 2) put a class on every other
tr, or 3) use javascript to do the styling for you.

Well, I've been playing the CSS expressions quite a bit lately and I've
found a much simpler solution which works in IE5.5+, using "expressions".
If
you're creating a web app that uses exclusively IE, or if you want to add
this feature for the majority of site visitors (using IE), then you can
use
the technique in the url above. At that url are some other fun things that
CSS expressions can do also.

I realize the CSS expressions are non-standard and not a solution which
everyone will find acceptable. But for those that can accept the limited
browser support (IE only) then they are quite powerful and convenient. On
projects where IE is the only browser being used to access the web app,
this
is going to be a great solution for me, I think. And in the future, as CSS
evolves and browsers support more advanced selectors, the CSS file can be
changed simply without needing to change anything in the content.

Thoughts?

I use a gecko-based browser, as do 27% of my visitors. An IE-only solution
is no solution at all for me.

What audience uses IE 5.5+ only? Maybe a company intranet that uses Windows
and no other O/S, that plans always to use IE and no other O/S, and knows
that its plans will never change. Methinks your solution is a curiousity
only.

[Spartanicus]

"Matt Kruse" <ne********@mattkruse.com> wrote:

I realize the CSS expressions are non-standard and not a solution which
everyone will find acceptable.

Thoughts?

Note the "www" in this group's name, hence your "method" is off topic
here. I'd suggest you go and crow about your "invention" in the
microsoft.* hierarchy.

--
Spartanicus

[Stuart Gilbert]

Matt Kruse wrote:

http://www.mattkruse.com/temp/css_expressions.html

One of the standard CSS questions is "how can I shade every other table row
a different color with CSS?"

The answers are usually 1) you can't (yet), 2) put a class on every other
tr, or 3) use javascript to do the styling for you.

Well, I've been playing the CSS expressions quite a bit lately and I've
found a much simpler solution which works in IE5.5+, using "expressions". If
you're creating a web app that uses exclusively IE, or if you want to add
this feature for the majority of site visitors (using IE), then you can use
the technique in the url above. At that url are some other fun things that
CSS expressions can do also.

I realize the CSS expressions are non-standard and not a solution which
everyone will find acceptable. But for those that can accept the limited
browser support (IE only) then they are quite powerful and convenient. On
projects where IE is the only browser being used to access the web app, this
is going to be a great solution for me, I think. And in the future, as CSS
evolves and browsers support more advanced selectors, the CSS file can be
changed simply without needing to change anything in the content.

Thoughts?

I have absolutely no use for this, but unlike the previous two people
I'm not going to make any cutting remarks or anything like that.

Congratulations on making something that someone might find useful. Now
try and see if you can think of a way to get it working in every browser ;)

Regards,

Stuart.

[Toby Inkster]

Matt Kruse wrote:

The answers are usually 1) you can't (yet), 2) put a class on every other
tr, or 3) use javascript to do the styling for you.

Correct me if I'm wrong (and I may well be), but don't MSIE's expressions
require JScript to be enabled? If so, what's the advantage of using them
over proper scripting?

--
Toby A Inkster BSc (Hons) ARCS
Contact Me ~ http://tobyinkster.co.uk/contact

[Alan J. Flavell]

On Tue, 7 Sep 2004, Matt Kruse wrote:

One of the standard CSS questions is "how can I shade every other
table row a different color with CSS?"
Table -rows- are easy, using standard means. So I'm not so very
interested in a non-WWW-only solution, even if it -does- "work" for
the unthinking masses who run a WWW-violating operating system
component instead of a web browser.

Table -columns- in alternating colours are quite awkward, though.
Well, of course it's easy, but it seems so wasteful setting classes on
every damned table cell, that one feels the need to find a more
appealing solution.
The answers are usually 1) you can't (yet),
Where did you get -that- from?
2) put a class on every other tr,
WFM.
or 3) use javascript to do the styling for you.
Pointless, unnecessary.
I realize the CSS expressions are non-standard and not a solution
which everyone will find acceptable.
Fine. CSS is optional too, so that's not a problem in itself.
Thoughts?

More of a worry to me is that you're prepared to support a
WWW-violating browser-like operating system component to the
apparent -exclusion- of the WWW.

MSIE isn't as incapable of rendering WWW-conforming pages as its
vendors would like us to believe. It needs a following wind and a bit
of tender care (I'll omit the "loving" part of that stock phrase), but
with suitable attention to detail it can cope.

If you want a windows-narrow web, then fine, you're entitled to your
opinion; but this here is supposed to be a WWW group.

Hope this helps.

[philiphjones]

On Tue, 7 Sep 2004 14:56:23 -0500, "Matt Kruse"
<ne********@mattkruse.com> wrote:

I realize the CSS expressions are non-standard and not a solution which
everyone will find acceptable.

It's lovely that people can get all high and mighty about being able
to turn their backs on MS's products. Some of us work for firms that
have adopted IE as THE ONLY BROWSER, and so spend a good bit of time
and energy getting it to do what we need it to do.

As one of those people in that fix, I'm very grateful for these
tricks; the alternating table rows is one I'm sure I'll use. Getting
another job where I don't have to work under such constraints,
appealing as it might sound, isn't really realistic.

I hope this newsgroup doesn't adopt as a criterion for posts that they
only apply to all browsers, or even the widest possible assortment.

Philip Jones

[Spartanicus]

philiphjones wrote:

I hope this newsgroup doesn't adopt as a criterion for posts that they
only apply to all browsers, or even the widest possible assortment.

The latter is what is and has always been propagated in the
comp.infosystems.www.authoring.* hierarchy. People who want to engage in
exclusionary practices are advised to find a more suitable platform.

--
Spartanicus

[Matt Kruse]

C A Upsdell wrote:

I use a gecko-based browser, as do 27% of my visitors.
Your stats are not the norm. *shrugs*
An IE-only solution is no solution at all for me.
Okay, that's cool. So why would you respond, if it doesn't apply to you?
What audience uses IE 5.5+ only? Maybe a company intranet that uses
Windows and no other O/S
Happens all the time.
that plans always to use IE and no other
O/S, and knows that its plans will never change. Methinks your
solution is a curiousity only.

Nope, it's a solution for a substantial subset of all browsers, which many
people will find useful and a solution to their specific requirements.
Whether you agree with the requirements or not really doesn't matter in this
context.

--
Matt Kruse
http://www.JavascriptToolbox.com

[Matt Kruse]

Toby Inkster wrote:

Correct me if I'm wrong (and I may well be), but don't MSIE's
expressions require JScript to be enabled? If so, what's the
advantage of using them over proper scripting?

They do require scripting to be on. I think they are much easier to
implement because with a scripting solution you need to either fire the
action onLoad of the document, or put the script at the bottom of the
document to run after the main document loads. That's more of a hassle than
simply including a css file, IMO.

--
Matt Kruse
http://www.JavascriptToolbox.com

[Matt Kruse]

Spartanicus wrote:

Note the "www" in this group's name, hence your "method" is off topic
here.

Not at all. Don't be so obtuse.
No solution works on every browser. Whether or not a specific solution will
work for you depends on requirements.

--
Matt Kruse
http://www.JavascriptToolbox.com

[Matt Kruse]

Alan J. Flavell wrote:

So I'm not so very
interested in a non-WWW-only solution, even if it -does- "work" for
the unthinking masses who run a WWW-violating operating system
component instead of a web browser.
You're right. The rest of the world is stupid. You're smart. You zealots
amuse me so!
(ps, I run windows and IE, and I don't consider myself part of the
unthinking masses. If you do, that's fine by me ;)
Table -columns- in alternating colours are quite awkward, though.
Columns would be pretty simple using css expressions also.

The answers are usually 1) you can't (yet),

Where did you get -that- from?

Perhaps you misunderstood. I meant, you can't do it strictly from a rule ala
CSS3, and expect it to work.
More of a worry to me is that you're prepared to support a
WWW-violating browser-like operating system component to the
apparent -exclusion- of the WWW.
If a web app is only accessed via IE, and you can use simple features to
enhance the web app, why would you choose not to?
If you want a windows-narrow web, then fine, you're entitled to your
opinion; but this here is supposed to be a WWW group.

Where is written that a "WWW" group is only for w3c-standard features? I use
IE. On the internet. To access the WWW. Therefore, it applies to me!

--
Matt Kruse
http://www.JavascriptToolbox.com

[Matt Kruse]

Spartanicus wrote:

philiphjones wrote:

I hope this newsgroup doesn't adopt as a criterion for posts that
they only apply to all browsers, or even the widest possible
assortment.

The latter is what is and has always been propagated in the
comp.infosystems.www.authoring.* hierarchy. People who want to engage
in exclusionary practices are advised to find a more suitable
platform.

Not everyone chooses to be a conformist follower. But hey, good luck with
that.

--
Matt Kruse
http://www.JavascriptToolbox.com

[Neal]

On Tue, 7 Sep 2004 20:12:30 -0500, Matt Kruse <ne********@mattkruse.com>
wrote:

Spartanicus wrote:

philiphjones wrote:

I hope this newsgroup doesn't adopt as a criterion for posts that
they only apply to all browsers, or even the widest possible
assortment.

The latter is what is and has always been propagated in the
comp.infosystems.www.authoring.* hierarchy. People who want to engage
in exclusionary practices are advised to find a more suitable
platform.

Not everyone chooses to be a conformist follower. But hey, good luck with
that.

I'm sorry you don't seem to understand. I'm not going to say your
discovery is a bad thing. I am saying, however, that it is not a WWW
solution.

This ng, which is centered on WWW authoring, deals with solutions which
work on as wide an assortment of browsers as possible. We complain that
the perfect solution fails on IE, but we understand that IE is an
important browser on the WWW. We also are not apathetic to solutions which
work well on IE - in fact, we are always looking for them.

If you can find a way to do something in IE and also have it work in other
browsers, I'll be happy to learn about it. But if it works only in IE,
it's out of place in this specific ng.

Yes, this ng is centered on WWW work, not merely IE work. Again, your
discovery is valuable, but not in a WWW context.

[Neal]

On Tue, 7 Sep 2004 20:08:41 -0500, Matt Kruse <ne********@mattkruse.com>
wrote:

Alan J. Flavell wrote:

So I'm not so very
interested in a non-WWW-only solution, even if it -does- "work" for
the unthinking masses who run a WWW-violating operating system
component instead of a web browser.
You're right. The rest of the world is stupid. You're smart. You zealots
amuse me so!

You're mistaking realism for zeal. Idealism is embracing IE as the One
Browser. It is decidedly not. Realism is realizing that many, many
browsers are in regular use, and regardless of market share they all must
be accomodated.
(ps, I run windows and IE, and I don't consider myself part of the
unthinking masses. If you do, that's fine by me ;)
I often use W98/IE6 as well. No shame there. I do avoid IE whenever
possible though.

Table -columns- in alternating colours are quite awkward, though.

Columns would be pretty simple using css expressions also.

IF all browsers supported it. That would be truly useful in a WWW context,
which happens to be the topic here.

More of a worry to me is that you're prepared to support a
WWW-violating browser-like operating system component to the
apparent -exclusion- of the WWW.

If a web app is only accessed via IE, and you can use simple features to
enhance the web app, why would you choose not to?

If it's IE only, it's NOT a WWW situation.
Where is written that a "WWW" group is only for w3c-standard features? I
use
IE. On the internet. To access the WWW. Therefore, it applies to me!

I use Opera. Others use Mozilla. What about us? Are we less than you?

[Neal]

On Tue, 7 Sep 2004 19:51:54 -0500, Matt Kruse <ne********@mattkruse.com>
wrote:

No solution works on every browser.

Read up, pilgrim.

[Harlan Messinger]

"Matt Kruse" <ne********@mattkruse.com> wrote:

Spartanicus wrote:

Note the "www" in this group's name, hence your "method" is off topic
here.

Not at all. Don't be so obtuse.
No solution works on every browser.

But solutions can either conform to WWW standards or not.

However, I think some here are giving you short shrift. If other
browsers were implementing CSS3 so that you could specify treatment
for odd and even child elements directly, and someone came here
bemoaning IE's failure to recognize the odd and even selectors, people
here would probably come forth suggesting hacks much like the one you
provided. But because other browsers are not implementing odds and
evens yet, your post is being treated as an announcement of an IE-only
feature, rather than as an IE work-around for an all-but-IE feature.
--
Harlan Messinger
Remove the first dot from my e-mail address.
Veuillez ôter le premier point de mon adresse de courriel.

[Harlan Messinger]

"Matt Kruse" <ne********@mattkruse.com> wrote:

Spartanicus wrote:

philiphjones wrote:

I hope this newsgroup doesn't adopt as a criterion for posts that
they only apply to all browsers, or even the widest possible
assortment.

The latter is what is and has always been propagated in the
comp.infosystems.www.authoring.* hierarchy. People who want to engage
in exclusionary practices are advised to find a more suitable
platform.

Not everyone chooses to be a conformist follower. But hey, good luck with
that.

If you want to be a non-conformist, you could go ahead and ask in
someplace really way out, like rec.knitting. There's something to be
said for trying to keep down the volume of postings about features
that aren't of use to people designing for the World Wide Web--and if
you're designing for the web, your page design shouldn't rely on
features that exist only in IE. As I said in another message, though,
I didn't see your particular original posting quite that way.

--
Harlan Messinger
Remove the first dot from my e-mail address.
Veuillez ôter le premier point de mon adresse de courriel.

[Matt Kruse]

Neal wrote:

This ng, which is centered on WWW authoring, deals with solutions
which work on as wide an assortment of browsers as possible.
You seem to be making a false assumption.
This newsgroup is for discussion of CSS. That's it.
From the FAQ:

Q: What kinds of posts are acceptable in this news group ?
A: Topics for this news group include:
* How to achieve a particular effect with style sheets,
* The relative advantages of different style sheet languages,
* Specifications versus implementations,
* Bugs and limitations in implementations, and
* Questions on XSL related subjects.

There's nothing in there that says one can only discuss CSS solutions which
work on as wide an assortment of browsers as possible! If you and some
others would like to treat this group as your playground where you decide
what can be discussed and how it should be discussed, well, good luck with
that.
If you can find a way to do something in IE and also have it work in
other browsers, I'll be happy to learn about it. But if it works only
in IE, it's out of place in this specific ng.
No it's not. There are solutions here which only work in Mozilla and Opera,
because IE doesn't support as much CSS. Does that mean these posts are
off-topic?

Wait, surely what you mean is that only posts which deal with the exact
specs are on-topic. Oh, but wait, some of the specs are merely
recommendations, and don't work in _any_ browsers yet. Are they off-topic?
Yes, this ng is centered on WWW work, not merely IE work. Again, your
discovery is valuable, but not in a WWW context.

Wrong again. Just because a solution doesn't work on _all_ browsers in a www
context does not mean it's worthless in a www context.

--
Matt Kruse
http://www.JavascriptToolbox.com

[Matt Kruse]

Neal wrote:

No solution works on every browser.

Read up, pilgrim.

Some browsers may have CSS disabled. None of your solutions will work.
If I choose to use Netscape3, none of your CSS will work.
If a person is using a text browser, _no_ row shading solutions will work.
Or did I misunderstand your statement, pilgrim?

--
Matt Kruse
http://www.JavascriptToolbox.com

[Matt Kruse]

Harlan Messinger wrote:

However, I think some here are giving you short shrift. If other
browsers were implementing CSS3 so that you could specify treatment
for odd and even child elements directly, and someone came here
bemoaning IE's failure to recognize the odd and even selectors, people
here would probably come forth suggesting hacks much like the one you
provided. But because other browsers are not implementing odds and
evens yet, your post is being treated as an announcement of an IE-only
feature, rather than as an IE work-around for an all-but-IE feature.
Exactly. Which is why I wrote:
And in the future, as CSS
evolves and browsers support more advanced selectors, the CSS file can be
changed simply without needing to change anything in the content.

So for now, you can use this technique to cover IE browsers, which for some
people is 100% of the browsers viewing the page, and for others it's
somewhere around 70%-95%. When Mozilla or Opera supports advanced css3
selectors that let you do this row shading through simple rules, then this
will be the 'hack' that allows IE to work also.

At that point, people will say "IE sucks! It doesn't support odd/even
selectors!". I'm saying other browsers need to catch up, because at least IE
provides an easy way to do it NOW :)

--
Matt Kruse
http://www.JavascriptToolbox.com

[Salagir]

On Tue, 7 Sep 2004 22:31:52 -0500, in comp.infosystems.www.authoring.stylesheets,
Matt Kruse wrote:

There's nothing in there that says one can only discuss CSS solutions which
work on as wide an assortment of browsers as possible!

THe key is not "widest assortment of browsers as possible" but "www
conforming browsers".
IE isn't. That's all.

And that's why the Subject should not have been "Solution!..."
but more something like "IE hack for alternating table row colors (fun
with JS in CSS)"
You would certainly be less flamed.
And for the "unthinking masses" in another post, we're not saying we're
more clever than you are, just that you're unthinking: you don't choose
your browser, and just take the first thing that Windows will open for
you.

--
++++++++ Zelda, Dragon Ball, Mana and my (art)work at www.salagir.com ++++++++

[Berislav Lopac]

Matt Kruse wrote:

Toby Inkster wrote:

Correct me if I'm wrong (and I may well be), but don't MSIE's
expressions require JScript to be enabled? If so, what's the
advantage of using them over proper scripting?

They do require scripting to be on. I think they are much easier to
implement because with a scripting solution you need to either fire
the action onLoad of the document, or put the script at the bottom of
the document to run after the main document loads. That's more of a
hassle than simply including a css file, IMO.

Or you can use window.onLoad in the script file itself, so it is no more of
a hassle than simply including a js file.

--
If the Internet is a Marx Brothers movie, and Web, e-mail, and IRC are
Groucho, Chico, and Harpo, then Usenet is Zeppo.

[Chris Sharman]

Matt Kruse wrote:

http://www.mattkruse.com/temp/css_expressions.html

One of the standard CSS questions is "how can I shade every other table row
a different color with CSS?"

The answers are usually 1) you can't (yet), 2) put a class on every other
tr, or 3) use javascript to do the styling for you.

Well, I've been playing the CSS expressions quite a bit lately and I've
found a much simpler solution which works in IE5.5+, using "expressions". If
you're creating a web app that uses exclusively IE, or if you want to add
this feature for the majority of site visitors (using IE), then you can use
the technique in the url above. At that url are some other fun things that
CSS expressions can do also.

I realize the CSS expressions are non-standard and not a solution which
everyone will find acceptable. But for those that can accept the limited
browser support (IE only) then they are quite powerful and convenient. On
projects where IE is the only browser being used to access the web app, this
is going to be a great solution for me, I think. And in the future, as CSS
evolves and browsers support more advanced selectors, the CSS file can be
changed simply without needing to change anything in the content.

Thoughts?

Great stuff. Can't believe the amount of negative responses you've got.
I use moz myself, and hope for the day when I can develop to standards,
but in the real world I see ie6 as the majority, and ie5 second,
together somewhere between 90 & 97% on the site stats I see, and has
been increasing for some time, so it's more hope than anticipation.

What I find 'unacceptable' are 'standard' solutions which don't work for
ie5+ - without an accompanying 'ie hack' they are pretty useless
(rightly or wrongly), except possibly for websites willing to write off
a large proportion of visitors.

Your solution:
degrades gracefully
is in the CSS (where it belongs)
will one day be useful in conjunction with css3 (as an ie hack).

We can loathe ie, but we can't realistically ignore it, and anything
which helps improve the browsing experience for ie users on our pages,
without degrading it for others, is to be applauded. Any web author who
thinks otherwise is obviously authoring primarily for web evangelism of
some kind, rather than any other cause, commercial or charitable.

Ducking now ... ;)
Chris

[Toby Inkster]

Matt Kruse wrote:

They do require scripting to be on. I think they are much easier to
implement because with a scripting solution you need to either fire the
action onLoad of the document, or put the script at the bottom of the
document to run after the main document loads. That's more of a hassle than
simply including a css file, IMO.

Write your script like this:

================== myscript.js ==================
function blah {
// ...
}
window.onload = blah;
=================================================

and then link to it like this:

<script src="myscript.js" type="text/javascript"></script>

No more hassle than linking to a CSS file.

--
Toby A Inkster BSc (Hons) ARCS
Contact Me ~ http://tobyinkster.co.uk/contact

[Toby Inkster]

Matt Kruse wrote:

C A Upsdell wrote:

I use a gecko-based browser, as do 27% of my visitors.

Your stats are not the norm. *shrugs*

True -- in the logs at work I normally see about 92% using Gecko, so C A
Upsdell's stats do seem abnormally low.

--
Toby A Inkster BSc (Hons) ARCS
Contact Me ~ http://tobyinkster.co.uk/contact

[Jan Roland Eriksson]

On Tue, 7 Sep 2004 22:31:52 -0500, "Matt Kruse"
<ne********@mattkruse.com> wrote:

Neal wrote:

This ng, which is centered on WWW authoring, deals with solutions
which work on as wide an assortment of browsers as possible.
You seem to be making a false assumption.
This newsgroup is for discussion of CSS. That's it.
From the FAQ:

Q: What kinds of posts are acceptable in this news group ?
A: Topics for this news group include:
* How to achieve a particular effect with style sheets,
* The relative advantages of different style sheet languages,
* Specifications versus implementations,
* Bugs and limitations in implementations, and
* Questions on XSL related subjects.

There's nothing in there that says one can only discuss CSS solutions which
work on as wide an assortment of browsers as possible!

Sure, but "CSS expressions" is not a part of any recognized style sheet
language. IMMIC these so called "expressions" surfaced as a result of a
5 year old dead end work on what was called BECSS (Behavioral Extensions
to CSS), where only MS actually did try to implement it (partially).

<http://www.w3.org/TR/1999/WD-becss-19990804>

If you'd like to discuss BECSS in IE5+ browsers with reference to the
m-FAQ of this NG it would fit better under the A-line "Bugs and
limitations in implementations" than to try to promote it as a "feature"
for some.
No it's not. There are solutions here which only work in Mozilla and Opera,
because IE doesn't support as much CSS. Does that mean these posts are
off-topic?
No, all along the line that CSS is optional and not supporting some
aspects of it is in fact according to specs.

[...]
Just because a solution doesn't work on _all_ browsers in a www
context does not mean it's worthless in a www context.

What you may want to worry about more is whether MS will offer continued
support for your promoted part of BECSS in a possible future IE version.

If you ask me I think its just plain stupid to suggest a presentation
that requires both a non standard CSS extension _and_ JScript in order
to "work".

In the meantime, while waiting for support of odd and even element
selectors, there are other fully supported ways to do what you want.

--
Rex

[Chris Morris]

"Alan J. Flavell" <fl*****@ph.gla.ac.uk> writes:

Table -columns- in alternating colours are quite awkward, though.
Well, of course it's easy, but it seems so wasteful setting classes on
every damned table cell, that one feels the need to find a more
appealing solution.

Doesn't work in IE, naturally, but for tables with column headers:
....
<tr><th id="th1">Col Header 1</th><th id="th2">Col Header 2<th>...
....
<tr><td headers="th1">...

td[headers~=th1],td[headers~=th3],td[headers~=th5] {
...
}

Or alternatively
td, td + td + td, ...
and
td + td, ...

Again doesn't work in IE.

So possibly that plus the IE expression thing, if the alternating
colours are important [1].

[1] With the usual caveat that they can't be that important or they'd
be expressed by <strong> or <em> on the cell contents rather than CSS
on the cell.

--
Chris

[Alan J. Flavell]

On Tue, 7 Sep 2004, Matt Kruse wrote:

I'm saying other browsers need to catch up, because at least IE
provides an easy way to do it NOW :)

http://www.us-cert.gov/cas/tips/ST04-012.html

Before clicking on a link to a web site that you are not familiar
with or do not trust, take the precaution of disabling active
content.

MS themselves have also intermittently given similar advice.

In a WWW context (which is what this group is about), it's probably
wise to treat all web sites as untrusted unless/until one has good
reason for doing otherwise.

On the other hand, all CSS is optional; so your IE-specific "solution"
is technically "working" even when it's doing nothing, I suppose.

[Alan J. Flavell]

On Tue, 7 Sep 2004, Matt Kruse wrote:

This newsgroup is for discussion of CSS. That's it.
Actually no. Other stylsheet languages would be on topic here, if
anyone was interested in discussing them. But don't you see the
"WWW" in the name hierarchy? That's there for a reason.
Wrong again. Just because a solution doesn't work on _all_ browsers
in a www context does not mean it's worthless in a www context.

It doesn't mean that it's worthless, right. But is it a "solution",
in a WWW context? To my way of thinking, it's no more a "solution"
than to propose making the materials available only in PowerPoint
format, rather than HTML+CSS. Which some folks certainly feel is the
right thing to do (I don't agree with them, just in case there's any
doubt).

[Matt Kruse]

Salagir wrote:

And for the "unthinking masses" in another post, we're not saying
we're more clever than you are, just that you're unthinking: you don't
choose your browser, and just take the first thing that Windows will open for you.

Typical elitist bullshit that so many of you parrots like to espouse.

FYI, I have about 20 browsers installed on my computer, including mozilla,
opera, netscape, and IE. I've used about every browser imaginable, since the
first release of mosaic. On several occassions I've moved to other browsers
as my 'primary' browser, only to move back to IE. I simply prefer it. To
imply that I or anyone else who chooses to use IE is doing so because we are
unthinking makes you look pretty stupid. IMO.

--
Matt Kruse
http://www.JavascriptToolbox.com

[C A Upsdell]

"Chris Sharman" <ch***********@sorry.nospam> wrote in message
news:ch*******************@news.demon.co.uk...

Matt Kruse wrote:
We can loathe ie, but we can't realistically ignore it, and anything which
helps improve the browsing experience for ie users on our pages, without
degrading it for others, is to be applauded. Any web author who thinks
otherwise is obviously authoring primarily for web evangelism of some
kind, rather than any other cause, commercial or charitable.

But what the OP wants to do can be done using standard CSS that works on all
browsers other than antiques. The 'solution' he came up with is for IE5.5+
only. I don't believe that criticising an IE-only solution when a simple
cross-browser solution exists has anything to do with 'web evangelism'.

[Matt Kruse]

C A Upsdell wrote:

But what the OP wants to do can be done using standard CSS that works
on all browsers other than antiques. The 'solution' he came up with
is for IE5.5+ only. I don't believe that criticising an IE-only
solution when a simple cross-browser solution exists has anything to
do with 'web evangelism'.

The two solutions are different approaches to solving the same problem, and
each has their own merits and drawbacks.

The 'standard' solution is to include a class="odd" or whatever on every
other row to highlight the row.
Pros:
1) Works across browsers using standard css
2) Easy to understand
Cons:
1) Requires server-side effort to insert classes
2) Row classes must be reassigned if the rows are sorted, inserted, or
deleted. It's very static.

The solution I posted:
Pros:
1) Uses only a single rule, and no class properties in rows. Row shading
can be added to a site by adding a single css rule which will work for all
tables on the site.
2) Continues to shade correctly even if you sort, insert, or delete rows
3) Rule can easily be swapped out later for a css3-style odd/even
selector when supported by newer browsers
Cons:
1) Only works in IE, with js enabled

Obviously, any intelligent designer needs to consider he pros and cons of
available solutions when deciding how to implement a feature. If you're
designing a public site and it's vital that as many visitors as possible see
the row shading, then the cross-browser solution is the logical choice. If
you're creating an internal site that is only accessed by IE, or if your
visitors are 90% IE and you don't care if 10% of visitors don't see the row
shading, then the solution I posted saves a lot of effort and provides more
benefits. It's the logical choice, IMO.

Look, people, it's just an option. It's a solution to a problem. It works,
in a known environment, which is all you can ask of _any_ solution. Whether
or not it's valuable to you is a personal decision based on your
requirements.

But it's quite ridiculous to proclaim something to be useless simply because
_you're_ requirements don't make it a viable solution for _you_.

--
Matt Kruse
http://www.JavascriptToolbox.com

[kchayka]

Chris Sharman wrote:

We can loathe ie, but we can't realistically ignore it, and anything
which helps improve the browsing experience for ie users on our pages,
without degrading it for others, is to be applauded.

Alternating row colors are a usability issue, not a browser issue. The
trouble with the "solution" is that, since it is a proprietary feature,
only those visitors using IE (with JS enabled) get the usability
benefit. I don't understand why someone would want to do this when there
are alternatives that would benefit visitors using virtually any
CSS-supporting browser, even NS4.

Promoting an IE-only solution is hankering for the bad-old-days. I
thought we were finally getting past that crap. Maybe I was optimistic. :(

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

[Richard Cornford]

Matt Kruse wrote:

http://www.mattkruse.com/temp/css_expressions.html

<snip>

The expression you use:-

table.data tbody tr {
background-color:expression( ((sourceIndex-
parentNode.firstChild.sourceIndex)%2==1)?
(parentNode.parentNode.rowHighlightColor||"#dddddd "):"");
}
(Not wrapped across lines in the original)

- is a little odd in using the - sourceIndex - property of elements. It
means that exactly which row will be the first row highlighted will
depend on the exact number of preceding elements within the DOM, will
not necessarily be consistent across tables on the same page using the
same rule, and will potentially get out of step if a table has multiple
TBODY elements with different numbers of rows.

A more consistent indicator of relative row position might be the -
rowIndex - property of TR elements. It was implemented in IE 4 and has
been formalised in the W3C HTML DOM specification from version 1, so it
will be found on all IE versions recognising expressions in style
sheets.

The test logic is a little excessive as - x%2 - will only produce
results that are 0 or 1 and thus can be directly type-converted into a
boolean value to resolve the expression for the conditional operator.

Those changes would reduce the expression to:-

table.data tbody tr {
background-color:expression((this.rowIndex%2)?"#dddddd":"");
}

-or:-

table.data tbody tr {
background-color:expression((!(this.rowIndex%2))?"#dddddd":"" );
}

- depending on whether odd or even rows where to be highlighted.
(disregarding the - rowHighlightColor - in the original)

Internet Explorer's style expressions are a relatively heavyweight
operation as they are re-calculated for the entire page every time the
mouse transitions from pixel to pixel (and on some other conditions,
such as changing of focus by tabbing, in addition). This can be
demonstrated by adding a script element:-

<script type="text/javascript">
var count = 0;
</script>

- and changing the expression to:-

table.data tbody tr {
background-color:expression((window.status=''+(++count))&&
(!(this.rowIndex%2))?"#dddddd":"");
}

- so that it writes an incrementing number to IE's status bar every time
the expression is re-evaluated. It doesn't take much interaction with a
page before that number has clocked-up 10,000 evaluations of the
expression.

This makes me think that a one-time application of CSS classes to table
rows with scripts might have more to be said for it than just the
additional support on other javascript and CSS capable browser. And if
re-ordering table rows client-side, then the application of initial
styles by writing CLASS attributes on the server and then modifying
their distribution when the table is re-ordered is probably going to
mean less work for the clients-computer overall.

Richard.

[Matt Kruse]

Richard Cornford wrote:

The expression you use:-
- is a little odd in using the - sourceIndex - property of elements.
It means that exactly which row will be the first row highlighted will
depend on the exact number of preceding elements within the DOM, will
not necessarily be consistent across tables on the same page using the
same rule, and will potentially get out of step if a table has
multiple TBODY elements with different numbers of rows.
Incorrect. If you look closer, it takes the sourceIndex - the sourceIndex of
the first TR in the TBODY that it is in. Since sourceIndex gives the
position within document.getElementsByTagName(sourceTag), it will always
return the correct index regardless of where in the table it is, or how many
tables appear on the page. The criticisms above are invalid.
A more consistent indicator of relative row position might be the -
rowIndex - property of TR elements.
I wasn't aware of this property. I'll check it out.
The test logic is a little excessive as - x%2 - will only produce
results that are 0 or 1 and thus can be directly type-converted into a
boolean value to resolve the expression for the conditional operator.
True, but sometimes I like to keep the ==1 or ==0 in there, for readability
and instructional purposes. It certainly doesn't hurt.
- depending on whether odd or even rows where to be highlighted.
(disregarding the - rowHighlightColor - in the original)
Ah, but that's a valuable feature ;)
Internet Explorer's style expressions are a relatively heavyweight
operation...

Yet I tested this on tables with hundreds of rows and there was no
performance problem. I've used even more complex expressions without any
performance problems. So I think it's fairly efficient.

--
Matt Kruse
http://www.JavascriptToolbox.com

[Richard Cornford]

Matt Kruse wrote:

Richard Cornford wrote:

The expression you use:-
- is a little odd in using the - sourceIndex - property of
elements. It means that exactly which row will be the first
row highlighted will depend on the exact number of preceding
elements within the DOM, will not necessarily be consistent
across tables on the same page using the same rule, and will
potentially get out of step if a table has multiple TBODY
elements with different numbers of rows.

Incorrect. If you look closer, it takes the sourceIndex - the
sourceIndex of the first TR in the TBODY that it is in. Since
sourceIndex gives the position within
document.getElementsByTagName(sourceTag), it will always
return the correct index regardless of where in the table
it is, or how many tables appear on the page. The criticisms
above are invalid.

Possibly it wasn't well expressed, but I am correct and the -
sourceIndex - property in IE browsers will not be of much practical use
in this application. Try two experiments to see what I mean: 1. Use a
table with an odd number of TDs per row (you might throw some colspans
in as an alternative). 2. Wrap any arbitrary word in a cell in the
middle of a table in an EM (or some similar) element. The magnitude of
the - sourceIndex - value of a TR depends on the number of elements that
precede it in the source and has no relationship with its - rowIndex -
except by coincidence.

A more consistent indicator of relative row position might
be the - rowIndex - property of TR elements.

I wasn't aware of this property. I'll check it out.

That is what you get when you accuse anyone who points you towards a w3C
standard of being a zealot instead of going and reading those standards.

The test logic is a little excessive as - x%2 - will only
produce results that are 0 or 1 and thus can be directly
type-converted into a boolean value to resolve the expression
for the conditional operator.

True, but sometimes I like to keep the ==1 or ==0 in there, for
readability and instructional purposes. It certainly doesn't hurt.

It is an extra and unnecessary operation in code that is evaluated
repeatedly.

- depending on whether odd or even rows where to be highlighted.
(disregarding the - rowHighlightColor - in the original)

Ah, but that's a valuable feature ;)

It is predicated on the use of custom attributes and therefor invalid
mark-up and it places presentational information in the HTML instead of
in the style sheet.

Internet Explorer's style expressions are a relatively
heavyweight operation...

Yet I tested this on tables with hundreds of rows and there
was no performance problem. I've used even more complex
expressions without any performance problems. So I think
it's fairly efficient.

How significant it is that IE continuously re-evaluates all of the
expressions that apply to a page will depend on how fast (and/or busy)
the user's computer is, and what else you are attempting to do with
scripts on the same page.

Richard.

[Pierre Goiffon]

"Chris Sharman" <ch***********@sorry.nospam> a écrit dans le message de
news:ch*******************@news.demon.co.uk

http://www.mattkruse.com/temp/css_expressions.html

Great stuff. Can't believe the amount of negative responses you've
got.
Exactly what I wanted to wrote :o) Well, this is just to consider as a
technology test, something that will not fit to real situations unless a
very specific context is met.
is in the CSS (where it belongs)
will one day be useful in conjunction with css3 (as an ie hack).

I wasn't aware that expression() was included in CSS3 ?! Do you have any
more information about it ?

[Markus Ernst]

Alan J. Flavell wrote:

Table -columns- in alternating colours are quite awkward, though.
Well, of course it's easy, but it seems so wasteful setting classes on
every damned table cell, that one feels the need to find a more
appealing solution.

You might like to use an editor such as Dreamweaver for this special purpose
;-)

--
Markus

[Alan J. Flavell]

On Fri, 10 Sep 2004, Markus Ernst wrote:

Alan J. Flavell wrote:

Table -columns- in alternating colours are quite awkward, though.
Well, of course it's easy, but it seems so wasteful setting
classes on every damned table cell, that one feels the need to
find a more appealing solution.

You might like to use an editor such as Dreamweaver for this special
purpose ;-)

OK, joke taken; but in case someone takes that too seriously, I
request the right to post a clarification.

It's /not/ the tedium of actually /writing/ the HTML that I was
complaining about, but the unsatisfying nature of the result. That
result would be at least as unsatisfying to me, no matter what the
cost of the authoring package that was used to extrude it.

[Brett Merkey]

"Matt Kruse" <ne********@mattkruse.com> wrote in message
news:ch*********@news2.newsguy.com...

http://www.mattkruse.com/temp/css_expressions.html
One of the standard CSS questions is "how can I shade every other table row a different color with CSS?"

All religious howling aside, this creative solution has some aspects that
merit attention:

1) this is the first useful application of sourceIndex I have come across,
even tho it has been supported in IE since 1997. Congratulations on that
alone.

2) it works for large tables with no appreciable degradation in
performance

3) it automatically adjusts the highlighting when columns are sorted or
rearranged in any way, thus taking a presentational load off such scripts.

4) it seamlessly applies to print style sheets with no extra effort

I prefer to forego alternating colors in tables because I think
table data rows should scroll in containers with limited height to insure
that page or application controls are always visible. Alternating rows
would be a distraction in that case. But for people with managers
who insist on seeing their data in the old-fashioned way, this is a
very practical solution.

Of course I am only speaking for the ultra tiny, scarcely significant
minority of shirtless vagabonds who work in exclusively IE environments.

Brett

[Brett Merkey]

Matt, Cornford's alternative inspired by your first solution is a blazing
winner. Accept it and move on to a few more of your experiments.

Still can't believe you got sourceIndex to do some work...

Brett
http://web.tampabay.rr.com/bmerkey/e...le-header.html

[Salagir]

On Wed, 8 Sep 2004 07:48:12 -0500, in
comp.infosystems.www.authoring.stylesheets, Matt Kruse wrote:

Salagir wrote:

And for the "unthinking masses" in another post, we're not saying
we're more clever than you are, just that you're unthinking: you don't
choose your browser, and just take the first thing that Windows will open
for you. FYI, I have about 20 browsers installed on my computer, [...]

That's good for you, but this really isn't the case for most of Windows
users.
They are usually astonished to hear that other (usable) browsers exist.

And I'm not saying they choosed to be unthinking. MS Windows makes its
best so people don't even think there could be an alternative to Media
Player, IE, and others.
On several occassions I've moved to other browsers
as my 'primary' browser, only to move back to IE. I simply prefer it.

!!
It takes all sorts to make a world, I guess.

It's your choice to prefer a 6 years old browser that doesn't know what is
CSS2, tab-browsing, pop-up blocking... etc. ;)

--
++++++++ Zelda, Dragon Ball, Mana and my (art)work at www.salagir.com ++++++++

[Garmt de Vries]

"Alan J. Flavell" <fl*****@ph.gla.ac.uk> wrote in message news:<Pi*******************************@ppepc56.ph .gla.ac.uk>...

Table -columns- in alternating colours are quite awkward, though.
Well, of course it's easy, but it seems so wasteful setting classes on
every damned table cell, that one feels the need to find a more
appealing solution.

Why not use <col> and set classes only once for every column? Seems to
work on my Opera 7, haven't tested in other browsers.

Garmt de Vries.

[Jukka K. Korpela]

gd*****@hotmail.com (Garmt de Vries) wrote:

Why not use <col> and set classes only once for every column?

And then? If you set <col class="foo">, how are you going to use the
class? Table cells are by definition subelements ("children") of <tr>
elements, never subelements of <col> elements. So if setting
..foo { ... }
seems to work, it should be regarded as a browser bug. This is of course
very inconvenient to authors.

--
Yucca, http://www.cs.tut.fi/~jkorpela/

[Chris Morris]

"Jukka K. Korpela" <jk******@cs.tut.fi> writes:

gd*****@hotmail.com (Garmt de Vries) wrote:

Why not use <col> and set classes only once for every column?

And then? If you set <col class="foo">, how are you going to use the
class? Table cells are by definition subelements ("children") of <tr>
elements, never subelements of <col> elements. So if setting
.foo { ... }
seems to work, it should be regarded as a browser bug. This is of course
very inconvenient to authors.

http://www.w3.org/TR/CSS2/tables.html#table-layers seems to imply that
(provided the table row (groups) and cells have a transparent
background) the background colour from the col should be used.

http://www.w3.org/TR/CSS2/tables.html#q4 seems to agree.

--
Chris

[Brian]

Chris Morris wrote:

http://www.w3.org/TR/CSS2/tables.html#table-layers seems to imply
that (provided the table row (groups) and cells have a transparent
background) the background colour from the col should be used.

http://www.w3.org/TR/CSS2/tables.html#q4 seems to agree.

It says that only 4 properties apply to <col> or <colgroup>. Since color
is not among them, you would have to set background color without
setting a text color, which is never a good idea.

--
Brian (remove "invalid" to email me)
http://www.tsmchughs.com/

[Andy Mabbett]

In message <bh********************************@4ax.com>,
philiphjones@?.?.invalid writes

It's lovely that people can get all high and mighty about being able to
turn their backs on MS's products. Some of us work for firms that have
adopted IE as THE ONLY BROWSER, and so spend a good bit of time and
energy getting it to do what we need it to do.

If you're writing for an Intranet, you should have said.

--
Andy Mabbett

Say "NO!" to compulsory ID Cards: <http://www.no2id.net/>