www.webdeveloper.com
Results 1 to 11 of 11

Thread: Background Images

  1. #1
    Join Date
    Apr 2005
    Location
    London
    Posts
    106

    Arrow Background Images

    Hi There,

    Can someone, by example, show the css for background-image.

    I tried this in my style sheet and it wasnt pulling the image through. I think its because I'm listing the url incorrectly can someone demonstrate this?

    Cheers

    Si

  2. #2
    Join Date
    Apr 2003
    Location
    Netherlands
    Posts
    21,654
    Code:
    #head {
    background: #ccc url(header.jpg) no-repeat fixed left;
    }
    At least 98% of internet users' DNA is identical to that of chimpanzees

  3. #3
    Join Date
    Apr 2005
    Posts
    4
    #elementid
    {
    background-image:url('path/to/myimage.gif');
    }

    and if in the path you need to go up one folder
    {
    background-image:url('..path/to/myimage.gif');
    }

  4. #4
    Join Date
    Apr 2005
    Posts
    24
    I had differences with this between IE and Netscape.

    Example
    The CSS file is stored in a directory called CSS
    The html file is stored in a directory called MyDir contains a link to the CSS above

    When using the example code previously posted, one browser (can't remember which)
    tries to find the image from the MyDir

    while the other browser looks for the image from the CSS directory

    I'm wondering if this is me or it is an actual difference in the browser types?

  5. #5
    Join Date
    Feb 2003
    Location
    Wales, UK
    Posts
    3,148
    If you're still experiencing problems then post your code and where they are in relation to each other.

    Don't forget in external stylesheets the url is relative to the stylesheet and not the page itself.
    In a world without walls and fences - who needs Windows and Gates?! - Unknown Author
    "And there's Bill Gates, the...most...famous...man in the...ah...Microsoft." -- A TV commentator for the 2000 Olympics.


    Web Design Faq? | W3C | Validator | Accessibility testing | Speed up your PC | Wura | Box Model Research

  6. #6
    Join Date
    Apr 2005
    Posts
    24
    The code is at

    www.lexcore.co.uk/Epic4

    but i have php which causes it to be very messy sometimes

    css/epic.css
    css/images/BGstars.gif
    Epic4/index.php3
    Epic4/images/BGstars.gif

    epic.css contains the code
    BODY
    { FONT-SIZE:14px; COLOR:WHITE; FONT-FAMILY:verdana,geneva,arial,helvetica,sans-serif;
    MARGIN-LEFT:5%; MARGIN-RIGHT:5%; BACKGROUND-IMAGE:URL("images/BGstars.gif"); BACKGROUND-COLOR:BLACK;
    }

    index.php3 contains the code
    <LINK REL="stylesheet" TYPE="text/css" HREF="../css/epic.css">

    the image is duplicated in the both directory because IE uses one and Netscape uses the other
    css/images
    Epic4/images

  7. #7
    Join Date
    Feb 2003
    Location
    Wales, UK
    Posts
    3,148
    That is strange. What if you put the image in the css directory? or move the images folder up with the css and epic ones?
    In a world without walls and fences - who needs Windows and Gates?! - Unknown Author
    "And there's Bill Gates, the...most...famous...man in the...ah...Microsoft." -- A TV commentator for the 2000 Olympics.


    Web Design Faq? | W3C | Validator | Accessibility testing | Speed up your PC | Wura | Box Model Research

  8. #8
    Join Date
    Apr 2005
    Posts
    24
    If i remember correctly, everything worked fine in Netscape.

    But when I went to IE, no background image was being displayed. Hence the reason I created the image directory in the ccs and copied the image there.

    Is there something to do with my page not containing a HTML version tag (reading up on that else-where).

  9. #9
    Join Date
    Feb 2003
    Location
    Wales, UK
    Posts
    3,148
    it could well be.
    Drop a transitional DTD on it.
    http://www.webdevfaqs.com/html.php#doctype
    In a world without walls and fences - who needs Windows and Gates?! - Unknown Author
    "And there's Bill Gates, the...most...famous...man in the...ah...Microsoft." -- A TV commentator for the 2000 Olympics.


    Web Design Faq? | W3C | Validator | Accessibility testing | Speed up your PC | Wura | Box Model Research

  10. #10
    Join Date
    Apr 2005
    Posts
    24
    Nope, didn't work. And yeah, Netscape displays the background from
    Epic/Images/

    while IE seems to want it in
    cc/Images/

  11. #11
    Join Date
    Feb 2003
    Location
    Wales, UK
    Posts
    3,148
    have you tried validating it at the w3c? There might be an error somewhere
    http://validator.w3.org/
    In a world without walls and fences - who needs Windows and Gates?! - Unknown Author
    "And there's Bill Gates, the...most...famous...man in the...ah...Microsoft." -- A TV commentator for the 2000 Olympics.


    Web Design Faq? | W3C | Validator | Accessibility testing | Speed up your PC | Wura | Box Model Research

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles