Grow your CSS skills. Land your dream job.

Background Images Not appearing

  • # July 28, 2009 at 6:30 am

    Hie

    My background images are not appearing. This is my code for the green part where a background image is supposed to be. I have just put different colours in the divs for now to differentiate them http://www.creativeastro.com/MSHeating/index.php

    Code:
    #main-pic{width:100%;
    height:620px;
    background-image:url(images/bg2.jpg);
    background-repeat:repeat-x;
    }

    Under the big img with the woman touching the boiler there are 3 divs and in each there is supposed to be background imgs which are green and the text that is there comes on top but those images are not appearing. They did at some point but not anymore.
    This is the code for them below:

    Code:
    #green-boxes{width:960px;
    margin:0 auto;}
    #green1{background-image:url(images/green1.jpg);
    background-repeat:repeat-x;
    float:left;
    margin-left:13px;
    width:234px;
    height:245px;}

    #green2{background-image:url(images/green2.jpg);
    background-repeat:repeat-x;
    float:left;
    width:243px;height:245px;}

    #green3{background-image:url(images/green3.jpg);
    background-repeat:repeat-x;
    width:229px;height:245px;
    float:left;
    margin-right:10px;}

    The html is

    Code:
    < !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


    < ?php include("includes/header.php"); ?>

    MS HeatingBosch Credited Installer

    Our Services

    • Boiler Replacements
    • Under Floor Heating
    • Power Flushing
    • Central Heating Installations
    • Boiler Servicing
    Maintenance and Repairs

    Boiler Maintenance is very important etc etc.

    Learn More

    get a quote

    Find out what our clients say about our work.

    Read Feed Back

    Get a quote

    < ?php include("includes/footer.php"); ?>


    I have a similar problems with the other pages but maybe if I sort out the main page I might be able to sort the other problems out, if not I will ask for help again.

    Thank you for reading, I hope you can help.

    # July 28, 2009 at 7:49 am

    Link not working.

    EDIT:
    Correct link is http://www.creativeastro.com/MSHeating/index.php

    # July 28, 2009 at 7:55 am

    Your images aren’t showing because the paths are incorrect. Should be:

    Code:
    #main-pic{width:100%;
    height:620px;
    background-image:url(../images/bg2.jpg);
    background-repeat:repeat-x;
    }
    # July 28, 2009 at 8:08 am

    Wow thanks you are a genius

    Yes that worked. It does help to have fresh eyes look at the code.

    Do you have any ideas why some images have worked with the path I had originally?

    # July 28, 2009 at 8:10 am
    Quote:
    Do you have any ideas why some images have worked with the path I had originally?

    The only way that path could possibly work would be if the stylesheet was at the root level ie. not in a directory.

    # July 28, 2009 at 8:43 am

    Okay thanks a lot, actually I noticed the other images worked because they were in the html not as a background via css.

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".