Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New Coder
    Join Date
    Feb 2009
    Posts
    15
    Thanks
    4
    Thanked 0 Times in 0 Posts

    Footer image repeat with CSS?

    Ok, in this page > http://adsphoenix.com/, there is one big image that seems to repeat-x only at the bottom of the page. I am talking about the big gradient that fades from the "dark forest greyish green" to the "forest green."

    If I need to post the code I want to apply it to I can, but I am not doing it now because I don't have any code to apply to it to, I just want to know how it can be done using CSS and XHTML.

    I am using an external style sheet by the way..


    I am sure I will have to post some code, so If I really need to I will make up a basic CSS layout and post all the codes I will be glad to.

    Thanks in advance!

    -Adam

  • #2
    Regular Coder
    Join Date
    Nov 2006
    Posts
    246
    Thanks
    13
    Thanked 26 Times in 24 Posts
    It's applied to their footer div, which spans 100% the width of the page. they're not really doing anything special there, or hard. Post your code, and I (or someone else) will show you how to do it. A general idea though would be:

    Code:
    #content {
        width: 100%;
        height: 600px;
        background-color: #FFF;
    }
    #footer {
        width: 100%;
        height: 300px;
        background: green url(../footer-gradient.gif) repeat-x;
    }
    Code:
    <div id="content">content</div>
    <div id="footer">footer</div>
    Last edited by Majoracle; 02-23-2009 at 03:13 AM.

  • #3
    New Coder
    Join Date
    Feb 2009
    Posts
    15
    Thanks
    4
    Thanked 0 Times in 0 Posts
    If that's all it is I can do it.
    If I do have any questions I'll post it.


    Thanks for helping out a new coder.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •