blocking inherence with CSS

[DavidJA]

Hey all,

I have a parent table and a child table.

On the parent table I define { background-color:red} , how do I stop the child table inherating this?

I would have thought it would be something like { background-color:'' } or { background-color:""} but that does not work....

 

[NEVERSLEEP]

<table bgcolor=red ...>
<tr>
<td ....>
<table bgcolor=wanted ...> etc..... ---------------------------------------

someone knowledge ends where
someone else knowledge starts

 

[DavidJA]

I mean doing it in CSS, not HTML.

 

[NEVERSLEEP]

{ background-color:red}
{ background-color:wanted}

no ? ---------------------------------------

someone knowledge ends where
someone else knowledge starts

 

[starway]

Use classes while applying styles:

.parent1 { background-color:red }
.child1 { background-color:green }


<table class=parent1>
<tr>
<td>
<table class=child1>
...


good luck

 

[DavidJA]

Ok

.parent1 TABLE { background-color:red }
.child1 TABLE { background-color:green }
.myCell {background-color:}

It's the last line thats killing me, some cells I don't want a background-color, at all, I just want to show the background image instead.

(note, above is a poor example because I don't want to cut and paste 100 lines of CSS code with notes)

 

[starway]

First of all, I don't see much sence in this construction, at least in your case:
.parent1 TABLE {}

This mean that a table should have the specified properties only if it is subordinated to any other element with class=parent1. I think it's useless in your case to define such complicated rules. Make things simple.

Second, there could NOT be something without some background colour. I think you mean to leave a colour set by default, which is white (or any other colour, in case you have some coloured html document body).

So all you have to do is to specify that default backgroung colour:
.myCell {background-color: something}

If you want a backgroung image, it's completely different story. Here's how to do it:
.someclass { background-image: url(&quot;someimage.gif&quot; }

Go to

http://www.devguru.com/Technologies/css/quickref/css_backgroundimage.html

to get info about other options available, such as positioning and image repeat modes.
But it doesn't hurt to specify both background colour and image, it is not required to chose only one of them.

good luck