<body style=”height: 100%; width: 100%; padding: 0px; margin: 0px;”>


HTML page:

<title>my css hacked page</title>
<link rel=”stylesheet” type=”text/css” href=”styles.css” />
<!–[if lt IE 7]>
<link rel=”stylesheet” type=”text/css” href=”iehacks.css”>
  <div class=”watermark”>….</div>…


/* styles for all browsers excluding IE7. Things not for IE7 will be left out with !important */
body {
    background-color: black;
    background-image: url(‘images/gradient.jpg’);

    background-position: left top;
    background-repeat: repeat-x;
}   /* black background with gradient on top. */

div.watermark {
    background-image: url(‘images/watermark.png’); /* transparent */
    background-position: left top !important; /* for all but IE */
    background-position: right top; /* for IE */
    background-repeat: no-repeat;


/* for IE6 and older */
div.watermark {
    background-image: url(‘images/watermark.gif’); /* here is a transparent that will be displayed better in IE6 and older */

Ofcourse above is just an example using semi-transparent png for all browsers but IE6 and older. Like that you’ll be able to make your website more compatible.