I have just figured a hack that I think might be useful to some one. It produces a semitransparent background using css around some text. Notice the text only fills the table cell that the image slice is in.
(I guess there maybe a way to make the background just fit the length of the text? (did I read that somewhere about divs and spans))
See an example in the slogan background orange over the header image here:
Demo site
I produced this with a semi transparent .png file and this code:
PHP Code:
.slogan {
font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
font-size: 18px;
font-weight: bold;
color: #FF9900;
background-image: url(/templates/yops_boxed_blue_lt/images/white-op60.png);
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
}
The 'background-image:blah' uses the png image as the background which is semi transparent but png don't display properly in M$ IE (!!!!!!!!!!!)
So the M$ filter blah makes the whole thing text and backgound semi transparent in M$ IE.
I know its a bit of a cludge but it looks okay. I guess you could make the background on a seperate layer and apply te filter to it and then write the text over with a transparent background but I think that would be too much work. So any comments folks?
A Tiny victory with semi transparent backgrounds! 
Misunderstood, just don't let me be... 
The text is the example you gave is on an image file. On my example the text is rendered as text. So using this method you can produce the effect dynamically from any content/menus/whatever.
Linear Mode
