css selecter question

D

Disco Octopus

Hi,
I was told that doing somehing like this is not valid CSS. I would like to
get a second opinion please....

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>my title</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<style type="text/css">
<!--
.dog td.toprow {color:red;background-color:blue;}
-->
</style>
</head>
<body>
<table class="dog">
<tr>
<th>header row data</th>
<th>header row data</th>
</tr>
<tr>
<td class="toprow">top row data</td>
<td class="toprow">top row data</td>
</tr>
<tr>
<td>not</td>
<td>not</td>
</tr>
</table>
</body>
</html>


Please note the style block, and please tell me if there is something not
perfect about the construction of the selector ".dog td.toprow { ... }"

If this is invalid, can you please give me a link to the W3C page that
suggests that this is invalid.

thanks very much.
 
T

Toby A Inkster

Disco said:
I was told that doing somehing like this is not valid CSS. I would like to
get a second opinion please....
Click to expand...

Looks fine to me. There is no need for the "<!--" and "-->" comments in
the CSS. It only effects some obscure beta of Netscape 3 Gold.
 
J

Jukka K. Korpela

Disco Octopus said:
I was told that doing somehing like this is not valid CSS. I would like
to get a second opinion please....
Click to expand...

OK, here's one: it is valid CSS. (Note that I'm giving you an opinion, not
saying that it's my opinion.)

Are there some other opinions? Well, could we say that it is both valid and
not valid? Or that it is neither? (Cf. to "this is sparkling CSS".)
 
M

Matthias Gutfeldt

Jukka said:
OK, here's one: it is valid CSS. (Note that I'm giving you an opinion, not
saying that it's my opinion.)

Are there some other opinions? Well, could we say that it is both valid and
not valid? Or that it is neither? (Cf. to "this is sparkling CSS".)
Click to expand...

LOL!

Yes, there was a different opinion. Someone in alt.php claimed it's not
valid. The guy obviously didn't understand CSS.


Matthias
 
J

Jukka K. Korpela

Matthias Gutfeldt said:
Someone in alt.php claimed it's not
valid. The guy obviously didn't understand CSS.
Click to expand...

Well, who _does_ understand CSS? We just have different holes in our
understanding. And this includes people who sort-of have defined and are
redefining CSS. :)

Anyway, the CSS rule
.dog td.toprow {color:red;background-color:blue;}
complies with CSS specifications (both CSS 1 and CSS 2) under any
interpretation. Some people say that this means it's "valid". Well, that's a
bit confusing, but not that it would remain exactly as "valid" if you
replaced the color name blue by the color name red (making text color and
background color the same).

It's not god CSS practice, though. The colors used (the "pure" colors) are
usually unsuitable for use on the Web, and that particular color combination
is not very good. Moreover, it would be better to set background, not just
background-color, since now any other style sheet that participates in the
cascade may freely set a background image, e.g. a nice Christmas-style
background which has strong red colors and little else.

As a practical consideration, it would be more natural to assign a class to
a <tr> element than to each <td> inside it separately. The latter approach
might escape some browser bugs, though.
 
D

Disco Octopus

Jukka said:
Well, who _does_ understand CSS? We just have different holes in our
understanding. And this includes people who sort-of have defined and
are redefining CSS. :)

Anyway, the CSS rule
.dog td.toprow {color:red;background-color:blue;}
complies with CSS specifications (both CSS 1 and CSS 2) under any
Click to expand...
My confusion is now that he has said the actual selector is not valid. (IE
the first "." (dot) in the selector _._dog td.toprow {...}
 
T

Toby A Inkster

Disco said:
My confusion is now that he has said the actual selector is not valid. (IE
the first "." (dot) in the selector _._dog td.toprow {...}
Click to expand...

Well, he is wrong.

".dog" is a valid shorthand for "*.dog" which will match any of the
following elements, amongst others:

<p class="dog" />
<div class="dog" />
<em class="big dog" />
<a class="hairy dog" />
<span class="hot dog with ketchup" />
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

Need help with <rowspan> in an HTML table 1
Javascript DOM 1
Can someone tell me if this a real tracker? Or is it one designed to show you a different message at certain times, ie. acting like one? 0
Bootstrap contact form not working 2
Sort by number of characters 1
How to wrap <td> content . 16
Uncaught ReferenceError: item is not defined at HTMLButtonElement.onclick in the: <button onclick="item.inserir()">Inserir dados</button> 1
How can I calculate the last payment of the year to be the sum of all previous payments for that year and subtracting it from Research Costs value? 7

Members online

Total: 329 (members: 4, guests: 325)
Robots: 414

Forum statistics

Threads
474,431
Messages
2,571,678
Members
48,796
Latest member
Greg L.

Latest Threads

Top