tags:

views:

82

answers:

2

I have 'tr' with background-image and on 'th' I want to show a image on its right corner to indiect if this column is sorted. I have css style like following:

tr.header {

background-image: url(../Images/bg.gif);
background-repeat: repeat-x;

}

th.sort {

background-repeat: no-repeat; 
background-position: center right; 
background-image: url(../Images/sort_bg.gif);

}

This works well on IE8 and firefox3, but not on IE7.

Anyone has any idea of how to make it working on IE7?

+1  A: 

Try adding this doctype to the top of your page:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"&gt;
joshperry
I tried, but it didn't make any difference.
A: 

are both classes not working or just one of the classes not working?

.header { background: url(../Images/bg.gif) repeat-x; } .sort { background: url(../Images/sort_bg.gif) no-repeat right; } /* should default to middle */

...
By not working on IE7 I mean: I want sort_bg.gif sit on top of bg.gif. but on IE7, bg.gif is replaced by sort_bg.gif, in another word, my tr has lost its background image.