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 4 of 4
  1. #1
    Regular Coder
    Join Date
    May 2008
    Posts
    446
    Thanks
    23
    Thanked 5 Times in 5 Posts

    div wont display background image

    I have done background-images a lot before without problem. But this time I have tried so many things but it wont load.

    I put the same path into an <img> and it loads, so its not the path.

    Here is the css I have tried:

    Code:
    .banner_image
    {
    background:url(images/logo.png);
    background-position: left top;
    background-repeat:no-repeat;
    }
    Code:
    .banner_image
    {
    background-image:url(images/logo.png);
    background-position: left top;
    background-repeat:no-repeat;
    }
    Code:
    .banner_image
    {
    background-image:url('images/logo.png');
    background-repeat:no-repeat;
    }
    I have tried setting the height, width and border of my div to make sure the image has space to load into... it has plenty.

    I checked the image in firebug, but it wont load there. Am I using the wrong syntax to call it?

    I have tried putting the css directly into the div with the style and in an external css file. Both times firebug cant load the image.

    What am I missing?

  • #2
    Registered User
    Join Date
    Jun 2011
    Posts
    1,063
    Thanks
    12
    Thanked 241 Times in 240 Posts
    try floating the div to the left.

    also you should define a height and width for the div of the background.

    ---



    you might also want to check to make sure the directories are the same for a stylesheet.

    <link rel="stylesheet" href="style/global.css"/>

    The global.css is in the "style" folder, which is one-up from the index.
    Therefore a background must be stated as :

    Code:
    background: url('/directory/images/banana.gif') no-repeat top left;
    Last edited by Sammy12; 07-08-2011 at 06:59 AM.

  • #3
    Regular Coder
    Join Date
    May 2008
    Posts
    446
    Thanks
    23
    Thanked 5 Times in 5 Posts
    Thank you for the reply, the directory was the problem. I wonder why it worked loaded into an image?

  • #4
    Registered User
    Join Date
    Jun 2011
    Posts
    1,063
    Thanks
    12
    Thanked 241 Times in 240 Posts
    loaded into an image?

    for index the path would be:
    Code:
    <img src="images/rada.gif"/>
    for a stylesheet in a style folder for the same image:
    Code:
    .rada { background: url('/directoryname/images/rada.gif');
    it has to do with the fact that the stylesheet is in a folder, while the index is in the directory.

    DIRECTORY - IMAGES/STYLE/INDEX.PHP, if your in "style" you need to go back to directory --> to to image --> then choose your image.

    well its working now so cheers to that!


  •  

    Posting Permissions

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