CODEWITHSUNDEEP
htmlcssinternet-explorer
stivlo
stivlo

Reputation: 85476

Transparent background color, but not transparent text in IE 6 and 7

I tried to follow the advices in CSS: semi-transparent background, but not text. I'm happy of the results in Firefox, Safari, Opera and Chrome. With these browsers I obtain a result similar to the one below, where you can see the background in transparency under the header. However, I've problems with IE.

You should click here to see the jsfiddle.

Expected Result

In IE8 is OK, but in IE6/7 there is no colored band at all. Anyone knows how to fix it?

Upvotes: 1

Views: 1529

Answers (1)

My Head Hurts
My Head Hurts

Reputation: 37665

In div.header:

Remove:

background-color: #0a5787;
background: transparent;

Add:

background: none;
zoom: 1;

Change:

/* For IE 5.5-7 */
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#900a5787, endColorstr=#900a5787);
/* For IE 8 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#900a5787, endColorstr=#900a5787)";

This works on IE7 when I test it and in theory I'm sure it should work in IE6, but on my emulator it is not working.

JSFiddle: http://jsfiddle.net/3jEbC/

Upvotes: 1

Related Questions