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.
Page 1 of 2 12 LastLast
Results 1 to 15 of 28
  1. #1
    New Coder
    Join Date
    Dec 2007
    Posts
    78
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Background Image Not Showing

    I can't for the life of me figure out why my background image is not showing up. When I go to its direct path URL...it's there.

    In my XHTML I have a div id named "page"

    Here's my CSS:

    body {
    margin: 0;
    padding: 0;
    background: #0f467c;
    }

    #page {
    background: url(images/bg.jpg) no-repeat center top;
    }


    *For the image path I've tried it like it is above, I've tried it like ../ and I've tried it like /

    I've also tried this...and nothing.

    #page {
    background: url(../images/bg.jpg) no-repeat center top;
    width: 100%;
    display: table;
    }


    Nothing.

    Any help would be appreciated.

    Respectfully,
    Len
    Last edited by lmw1; 04-17-2011 at 07:39 AM. Reason: more text
    Trust everybody. Just don't trust the Devil inside of them.

  • #2
    Banned
    Join Date
    Feb 2011
    Posts
    2,699
    Thanks
    13
    Thanked 395 Times in 395 Posts
    You haven't specified where the images directory is in relation to the directory your web page is in.

    If your css is in an external file, the relative path is referenced from the directory the css file is in.

    If images is a child directory then I normally specify the path as

    url('./images.num1.jpg')

    . = current directory

    .. = parent directory

  • #3
    New Coder
    Join Date
    Oct 2010
    Location
    Like me, on a tiny speck of dust floating in the Virgo Cluster.
    Posts
    29
    Thanks
    1
    Thanked 1 Time in 1 Post
    lmw:

    Have you inserted the full path to the img?

    Such as
    Code:
    #page {
    background: url(http://mydomainonthe.web/images/bg.jpg) no-repeat center top;
    }
    Give that a shot, and let us know.

  • #4
    New Coder
    Join Date
    Dec 2007
    Posts
    78
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Yep.

    I can see it when I go to it in my browser.

    But not when I code it in my CSS.

    I'm stumped....
    Trust everybody. Just don't trust the Devil inside of them.

  • #5
    Banned
    Join Date
    Feb 2011
    Posts
    2,699
    Thanks
    13
    Thanked 395 Times in 395 Posts
    if using relative paths (which I normally do as well) you have to have the correct starting point. See post 2

  • #6
    New Coder
    Join Date
    Dec 2007
    Posts
    78
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Tried every combination.

    Nothing.
    Trust everybody. Just don't trust the Devil inside of them.

  • #7
    New Coder
    Join Date
    Oct 2010
    Location
    Like me, on a tiny speck of dust floating in the Virgo Cluster.
    Posts
    29
    Thanks
    1
    Thanked 1 Time in 1 Post
    Can you give us your URL?

  • #8
    New Coder
    Join Date
    Dec 2007
    Posts
    78
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Trust everybody. Just don't trust the Devil inside of them.

  • #9
    Banned
    Join Date
    Feb 2011
    Posts
    2,699
    Thanks
    13
    Thanked 395 Times in 395 Posts
    Quote Originally Posted by lmw1 View Post
    Tried every combination.
    That's not true, because if you tried the correct one it would work

    You haven't provided info regarding

    You haven't specified where the images directory is in relation to the directory your web page is in.

    If your css is in an external file, the relative path is referenced from the directory the css file is in.
    so I can't help anymore. Your problem is a simple fix. You just need to know the start and end points (which you haven't specified) and then specify the correct relative path between them

  • #10
    New Coder
    Join Date
    Oct 2010
    Location
    Like me, on a tiny speck of dust floating in the Virgo Cluster.
    Posts
    29
    Thanks
    1
    Thanked 1 Time in 1 Post
    Insert this:
    Code:
    #page {
    background: url(http://www . americanwebmakers . com/demo_college/images/bg.jpg) no-repeat center top;
    }
    PS: I inserted the spaces so the URL would not get chopped.
    Last edited by Leprkawn; 04-17-2011 at 07:52 AM.

  • #11
    New Coder
    Join Date
    Dec 2007
    Posts
    78
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Nope.

    Nothing.
    Trust everybody. Just don't trust the Devil inside of them.

  • #12
    New Coder
    Join Date
    Dec 2007
    Posts
    78
    Thanks
    2
    Thanked 0 Times in 0 Posts
    URL is above.

    Path to image file is in the images folder (bg.jpg)

    In the root all that's there is:

    3 Folders (scripts, css & images)
    and 1 index.htm file

    That's all.
    Trust everybody. Just don't trust the Devil inside of them.

  • #13
    New Coder
    Join Date
    Oct 2010
    Location
    Like me, on a tiny speck of dust floating in the Virgo Cluster.
    Posts
    29
    Thanks
    1
    Thanked 1 Time in 1 Post
    BTW, if you move everything out of the demo_college folder, make sure to fix that in the path when you do that.

  • #14
    New Coder
    Join Date
    Dec 2007
    Posts
    78
    Thanks
    2
    Thanked 0 Times in 0 Posts
    I'm not moving anything out of that folder because that's the folder I'm making the website in.

    I can't believe I'm stumped on this. Crazy!

    Can't move forward until it's fixed though.

    I appreciate you guys helping me. Let's figure this thing out.
    Trust everybody. Just don't trust the Devil inside of them.

  • #15
    Banned
    Join Date
    Feb 2011
    Posts
    2,699
    Thanks
    13
    Thanked 395 Times in 395 Posts
    Your source code says

    Code:
    <link type="text/css" rel="stylesheet" href="css/main.css" media="screen" />
    so there's your problem.

    I've already posted how to fix it, assuming your file permissions are ok, so I'll leave it to you because I'm not into spoon feeding


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

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