Ho un problema CSS con 2 bg:

Volevo utilizzare un bg (es rosso) e sopra mettere un'immagine sfumata (che va dal giallo al rosso) in modo da creare un effetto sfumatura.
Ho allora creato il seguente codice:

BODY {
margin-top: 0px;
margin-left: 0px;
background-image: url(../img/bg_sfumato.gif);
background-repeat : repeat-x ;
background-color: #9C1A00;
}

Il problema è che così facendo la pagina mi pende come valore primario il colore #9C1A00 e non mi mette l'immagine sfumata.
Ho provato allora a creare un:

<table width="100%" class="bgimg">

preceduto dal codice:

.bgimg{
background-image: url(../img/bg_sfumato.gif);
background-repeat : repeat-x ;
}

ma anche qui c'è un "bug" che non arriva al 100% ma a pochi px dalla barra del browser mi rimane "rosso" senza sfumatura..
Qualcuno sa come potreirisolvere il problema?
Grazie