Zowel de body als de html hebben een transparante "png" als background die met de background-properties gepositioneerd zijn. Gebruik de gradient-css-1.png en de gradient-css-2.png om het voorbeeld te testen op jouw webruimte. De W3C validator is niet tevreden over de padding-right:-8px die in de stylesheet voorkomt (voor de body), maar het is geen enkel probleem als je dat statement weglaat. Het dient er alleen maar voor om de horizontale schuifbalk niet onnodig in te schakelen. Om deze meervoudige css gradient op jouw scherm te "zetten" hoef je alleen maar de onderstaande stylesheet in de head-sectie van jouw pagina te plaatsen.
<style type="text/css">
html{
background:url('gradient-css-1.png') repeat-x 50% 50%;
height:100%;
margin-top:-20px}
body{
background:url('gradient-css-2.png') repeat-y 30% 30% ;
height:100%;
margin:0;
padding-left:8px;
padding-right:-8px;
padding-top:20px}
</style>