Member Offer
  1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Background image in a table not appearing in browsers

Discussion in 'Website Coding & Programming Forum:' started by sweetums, Feb 25, 2009.

  1. sweetums

    sweetums Member

    I'm making a web page that is table based and I am having trouble with a background image in the table.
    I've tried adding the background to a table using CSS.
    I've given the table an ID, and created a style rule to apply the appropriate CSS background properties.


    Here is the bit of code that I'm using:

    #mytable_id {
    background-image: url(/assets/images/my_background.png);
    background-repeat: no-repeat;
    }



    This makes the image appear in the Dreamweaver screen but when I click to Preview it in a browser
    window it is not visible. I've tried it in Safari and Firefox and both have the same results.

    Any ideas where I'm going wrong?
     
  2. salvador

    salvador Member

    If you can provide me with a copy of your file(s), it will help me rectify the issue for you quick.

    ~Peace~
     
  3. conanite

    conanite New Member

    I put the url of the image in single-quotes. I don't know if this is required by the specification, but I haven't had problems either.

    background-image: url('/assets/images/my_background.png');

    the other thing that might be going wrong is the availability of the file - is it in the right place relative to the parent file so that the browser will find it? When dreamweaver sets up a preview, does it ensure related resources are properly in place?
     
  4. sweetums

    sweetums Member

    Salvador, thanks for the offer and I was gonna take you up on it but luckily Conanite's suggestion worked.
    Thanks to both of you for helping out. :icon_notworthy:
     
  5. KevJaques

    KevJaques Member

    Try to avoid using tables, you can easily use lists for tabular data and it's so worth the effort.

    you can also shorten the css by doing this

    background: url(/assets/images/my_background.png) no-repeat;

    you can also put in a colour before the img too, handy if you want to use transparent graphics
     

Share This Page