Olaf & Marc,

Thanks so much for helping me with my CSS. It hadn't occurred to me to first empty the style like you suggest Marc. What about using the !important command in my CSS? Which would be better? I'm gonna run out to the web and do some reading on the use of !important.

Thanks for your help, guys!! :o)

Chris

Marc Jansen wrote:
Hi Christopher,

this is rather important due to the css cascade:
I should probably also mention, that the initial colors on the calendar are set in-line as ColdFusion builds the page. It is this way that I make the weekend cells a different color from the weekday cells.
Your inline css (defined within the attribute 'style', I guess) is more dominant than the class.

Imagine the following HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Page title</title>
<style type="text/css">
td {
  padding: 2px;
  width: 150px;
  border: 1px solid #000;
  background-color: #888;
}
.special-class {
  background-color: yellow;
}
.add-me {
  background-color: orange;
}
</style>
</head>
<body>

<table>
  <tr id="firstrow">
    <th>FIRST</td>
    <td>styled via <code>td</code></td>
    <td class="special-class">styled via <code>class</code></td>
    <td class="special-class" style="background-color: red;">styled via 
<code>class</code> and inline styles</td>
  </tr>
  <tr id="secondrow">
    <th>SECOND</th>
    <td>styled via <code>td</code></td>
    <td class="special-class">styled via <code>class</code></td>
    <td class="special-class" style="background-color: red;">styled via 
<code>class</code> and inline styles</td>
  </tr>
  <tr id="thirdrow">
    <th>THIRD</th>
    <td>styled via <code>td</code></td>
    <td class="special-class">styled via <code>class</code></td>
    <td class="special-class" style="background-color: red;">styled via 
<code>class</code> and inline styles</td>
  </tr>
</table>

</body>
</html>

One will see three rows with each having three tds colored grey, yellow, red 
(from left to right).

via:

$('#secondrow td').addClass('add-me');
the class with orange background-color is set for the tds in the second row, 
but only the first two of them will change color as the inline style has more 
weight.

using:
$('#thirdrow td').attr('style', '').addClass('add-me');
you'll get the expected result.

So maybe you should reset the style-attribute...


_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/


--
http://cjordan.info

_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/

Reply via email to