Home/ Questions/Q 7090375
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-28T08:02:41+00:00

I’m trying to add a gradient to the body background which starts from white

  • 0

I’m trying to add a gradient to the body background which starts from white and ends in grey at the bottom of the page. Since the page has a sticky footer, when the content is bigger than the browser window, the body doesn’t stretch/expand with the content. So the gradient stops in the middle. Can someone please help?

HTML :

<html>
    <body>
        <div class="content"> </div>
        <div class="footer"> </div>
    </body>
</html>

CSS :

html {
    height:100%;
}
body { 
    height:100%;
    background: -moz-linear-gradient(top, #fff 0%, #d5d6db 100%);
}
.content {
    min-height: 100%;
}    
.footer {
    height: 55px;
}
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    background-attachment:fixed;

    Add this to your body CSS.

    On a side note you may know this already but: background: -moz-linear-gradient(top, #fff 0%, #d5d6db 100%); won’t work on IE. This property is only for Mozilla Based browsers.

    Cross Browser CSS Gradient …
    http://webdesignerwall.com/tutorials/cross-browser-css-gradient

    • 0