buttons getting whitewashed - ie7 Bug or style bug?

Giganews Newsgroups
Subject: buttons getting whitewashed - ie7 Bug or style bug?
Posted by:  Miked (mike.dershowi…@gmail.com)
Date: Tue, 11 Dec 2007

Hello:

I'm having an interesting style issue.  I have the following style
that I use to create a button:

..button {
background-image:url(img/button_done.jpg);
height:30px;
padding-left: 5px;
padding-right: 5px;
margin: 5px;
border:none;
text-align:center;
font-family: "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial,
Helvetica;
font-size:12px;
font-weight:bold;
color:#FFFFFF;
}

The background image is just a 30px high gradiated blue background.
What's weird is that in some versions of IE7, not in all, the button
effectively gets white-washed, almost looking as if the "color" that
set to white (#FFFFFF) is covering over the image.  I thought this was
a common technique to create a non-image (or small image) button on
sites while allowing for expandable text.

When the button presents on the page, the border is still there, you
can't see the text of the button, and the center is definitely white.
What can I do to prevent this.

Thanks very much in advance for your help!

Mike

Replies