Is it possible to change text color based on background color using CSS?

Here is my solution (thinking it through a different way):

Use a DIV with overflow: hidden; for the navy 'bar' that shows the rating scale. You then write out two sets of TEXT:

1. Inside the DIV bar (overflow: hidden;), it would be white (on top)
2. In the underlying DIV container, it would be black. (container)

The result would be an overlap of the two colored text divs:

 ________________________________
|          1          |    2     |
|_(dark blue w white)_|__________|

<div style="position: relative; width: 250px; background: white; border: 1px solid #000; color: #000;">
<div style="position: absolute; z-index: 10; overflow: hidden; width: 105px; background-color: navy; white-space:nowrap; color: #FFF;">
    Between 4:00 and 6:00 blah blah
</div>
    Between 4:00 and 6:00 blah blah
</div>

It works great because it will 'cut through' letters if the bar is at that width. Check it out, I think its what you are looking for.