1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

my background image doesn't apper when uploading to the internet

Discussion in 'HTML & Website Design' started by huseinbandi, Apr 18, 2012.

  1. #1
    Hey guys.. i need your help urgently.. i have a problem when i'm trying to use background image on my web project. when.. i'm testing this on the localhost server.. the image show up and can load correctly. but i got a trouble when i'm upload this on the internet.. the background image doesn't appear..

    this for the screenshot:
    (on localhost)
    [​IMG]

    (on the internet)
    [​IMG]

    please help me guys..
    _http://blog.eviltroops.com
     
    Last edited: Apr 18, 2012
    huseinbandi, Apr 18, 2012 IP
  2. honeyclarck

    honeyclarck Peon

    Messages:
    196
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Which browser you are using in my point of view this issue is browser compatibility. Change your browser if your see correct than fix it in code.
     
    honeyclarck, Apr 18, 2012 IP
  3. huseinbandi

    huseinbandi Well-Known Member

    Messages:
    1,060
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    130
    #3
    off course all 4 Standard Browser (IE,Mozilla, Safari and Opera )...
    well.. this is for the website.. _http://blog.eviltroops.com
     
    huseinbandi, Apr 18, 2012 IP
  4. muffet

    muffet Active Member

    Messages:
    720
    Likes Received:
    7
    Best Answers:
    4
    Trophy Points:
    68
    #4
    Is your background image tag closed correctly? Try Mozilla Firebug, it will show any code errors you might have overlooked.
     
    muffet, Apr 18, 2012 IP
  5. huseinbandi

    huseinbandi Well-Known Member

    Messages:
    1,060
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    130
    #5
    yes of course, just look at my 2 screenshot below.. i don't understand why when i open it on localhost, the background was showing up, and not when i'm upload that to the internet..
     
    huseinbandi, Apr 18, 2012 IP
  6. PRABHU111

    PRABHU111 Peon

    Messages:
    1
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #6
    If u r using mozilla Firefox check it with the firebug and also check the given path .be sure u r path as well as extion for the background is correct
     
    PRABHU111, Apr 18, 2012 IP
  7. muffet

    muffet Active Member

    Messages:
    720
    Likes Received:
    7
    Best Answers:
    4
    Trophy Points:
    68
    #7
    Because your local host doesn't follow Google, FoxFire or other browser properties. Please post your code so we would be able to better help you. Maybe there's error or something you're overlooking in your code which more eyes would be able to readily spot. You can also use Firebug Lite in Chrome if Google is your preferred default browser.

     
    Last edited: Apr 19, 2012
    muffet, Apr 19, 2012 IP
  8. huseinbandi

    huseinbandi Well-Known Member

    Messages:
    1,060
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    130
    #8

    this for CSS Style code:

    body{
    background-image: -moz-linear-gradient( 90deg, rgba(89,133,16,1) 10%, rgba(255,255,255,1) 80%);
    background-image: -o-linear-gradient( 90deg, rgba(89,133,16,1) 10%, rgba(255,255,255,1) 80%);
    background-image: -webkit-linear-gradient( 90deg, rgba(89,133,16,1) 10%, rgba(255,255,255,1) 80%);
    background-image: linear-gradient( 90deg, rgba(89,133,16,1) 10%, rgba(255,255,255,1) 80%);

    }

    #wrapper{
    background: url(img/bg.png) no-repeat;
    width:960px;
    margin: 0 auto;
    overflow: hidden;
    }


    and this is for HTML code:

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="utf-8">
    <title>title</title>
    <link rel="stylesheet" href="style.css">
    <script src="script.js"></script>
    </head>
    <body>
    <div id="wrapper">
    <section id="leftbar">
    <section id="leftbar-border">
    <section class="logo">
    <h1>FoodCourt</h1>
    <h3>tagline here</h3>
    </section><!--end logo-->
     
    huseinbandi, Apr 20, 2012 IP
  9. muffet

    muffet Active Member

    Messages:
    720
    Likes Received:
    7
    Best Answers:
    4
    Trophy Points:
    68
    #9
    What is "wrapper" controlling? Is this the background image that's not showing in internet?

     
    muffet, Apr 20, 2012 IP
  10. matt_62

    matt_62 Prominent Member

    Messages:
    1,827
    Likes Received:
    515
    Best Answers:
    14
    Trophy Points:
    350
    #10
    ok.
    i ran your site on the w3c validator and got this message:
    "66 Errors, 67 warning(s) "

    if you fix these, your site will be better, and more compliant. If you have missed a tag or failed to close something off, using the w3schools validator will help you to find coding errors.

    As to the specific image, i would recheck file permissions, and set it to 777.

    also i checked your css, and it says:
    [h=3]"Sorry! We found the following errors (73)"[/h]
    Each error can cause your page to not render correctly, and or you may have erratic results in various browsers
     
    matt_62, Apr 20, 2012 IP
  11. imranamen6

    imranamen6 Active Member

    Messages:
    947
    Likes Received:
    4
    Best Answers:
    1
    Trophy Points:
    98
    Digital Goods:
    1
    #11
    Well for me this problem is almost everytime :d

    On local server the images are not case sensetive but on the server they are case sensetive especially the .jpg, .png extensions. So See the image you are using in the background is in bg.PNG or bg.png.

    also i have tried accessing the image directly i think ists not uploaded

    http://blog.eviltroops.com/img/bg.png


    hope this will solve the problem ;)
     
    imranamen6, Apr 20, 2012 IP
  12. huseinbandi

    huseinbandi Well-Known Member

    Messages:
    1,060
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    130
    #12
    yeah,, i use .png in writing not .PNG,but still not working... oh man.. i really confuse bout this..
     
    huseinbandi, Apr 20, 2012 IP
  13. matt_62

    matt_62 Prominent Member

    Messages:
    1,827
    Likes Received:
    515
    Best Answers:
    14
    Trophy Points:
    350
    #13
    ok, ive had another look and im even more confused then before, i honestly cant understand why its not working, in fact, clicking directly on the image links me to a webhosting company, and thats just bizzare!

    Try this, you have bg.jpg on the server, just change all references to point to bg.jpg and it will work. the image loads fine for me test:
    http://blog.eviltroops.com/img/bg.jpg
     
    matt_62, Apr 20, 2012 IP
  14. matt_62

    matt_62 Prominent Member

    Messages:
    1,827
    Likes Received:
    515
    Best Answers:
    14
    Trophy Points:
    350
    #14
    um, also put in a blank index.html file into any folder that you dont want the public to view, i would start with your image folder.
     
    matt_62, Apr 20, 2012 IP
  15. Devitor

    Devitor Peon

    Messages:
    57
    Likes Received:
    2
    Best Answers:
    1
    Trophy Points:
    0
    #15
    Matt you are getting redirected by the hosting company that he is using.

    As far as the background goes. It looks to me like it is not even uploaded, I have no problem changing the background image to any other images that are located on your server.

    My suggestion would be to double check that the image is in fact uploaded and that it's name and file extension match what is on your server.
     
    Devitor, Apr 20, 2012 IP
  16. huseinbandi

    huseinbandi Well-Known Member

    Messages:
    1,060
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    130
    #16
    double check? i still not understand.. please help me fix this problem..
     
    huseinbandi, Apr 21, 2012 IP
  17. Devitor

    Devitor Peon

    Messages:
    57
    Likes Received:
    2
    Best Answers:
    1
    Trophy Points:
    0
    #17
    What I am saying is that I don't think your background image is uploaded. Are you able to find and link the background image you are trying to use for this website.

    Try to link the same image that you are trying to use here in the forums. If you are able to link it then clearly the issue is something else.
     
    Devitor, Apr 21, 2012 IP
  18. imranamen6

    imranamen6 Active Member

    Messages:
    947
    Likes Received:
    4
    Best Answers:
    1
    Trophy Points:
    98
    Digital Goods:
    1
    #18
    You are right devitor. I have directed him to the solution but he is still unable to understand.

    Just upload the file in the ftp and check if it is there. As for now the bg.png is nowhere on the server.
     
    imranamen6, Apr 21, 2012 IP
  19. war_machine

    war_machine Active Member

    Messages:
    1,319
    Likes Received:
    7
    Best Answers:
    1
    Trophy Points:
    53
    #19
    I could see the background image on my browser. Whats the problem with that?
     
    war_machine, Apr 22, 2012 IP
  20. printbucket

    printbucket Greenhorn

    Messages:
    26
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    11
    #20
    Sometimes, it may be because of a simple filename inconsistency. A lot of problems like these are caused by inconsistencies even when we think we have uploaded them. Make sure the image file is not duplicated or mislabeled.
     
    printbucket, May 21, 2012 IP