SitePoint Sponsor

User Tag List

Results 1 to 9 of 9

Thread: CSS and URLs

  1. #1
    SitePoint Zealot dkilburn's Avatar
    Join Date
    Jul 2000
    Location
    Inyokern, CA
    Posts
    181
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question

    I am setting up my site using CSS. Each class I teach is in it's own subdirectory. I've got 3 levels of pages, organized into directories as follows:

    index.htm
    .....CSS subdirectory
    .....Graphics subdirectory
    .....Research subdirectory
    ..........index.htm
    ..........other files
    .....Internet subdirectory
    ..........Section 1 subdirectory
    ...............index.htm
    ...............other files
    ..........Section 2 subdirectory
    ...............index.htm
    ...............other files


    I want to set up the css file to indicate the background image for the pages. Can I use relative URLs? If so, is the image relative to the CSS page or to the html pages? When I tried using URLs relative to the css file, it rendered ok in netscape but not IE. When I changed them to be relative to the htm files, it worked in IE but not netscape. Finally, I just used the absolute URL and that seems to have solved the problem.

    I've run into the same problem trying to include other image urls in the css files.

    Any suggestions are appreciated!!

    Debby Kilburn
    Debby Kilburn
    "With computers, everything is possible, but nothing is easy"
    AIM: fourhweb

  2. #2
    Your Lord and Master, Foamy gold trophy Hierophant's Avatar
    Join Date
    Aug 1999
    Location
    Lancaster, Ca. USA
    Posts
    12,305
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    For your image urls in your CSS file....

    use
    /graphics/imagename.gif

    Then it is relative from your root directory and will work whether its relative to the CSS file or the HTML file.
    Wayne Luke
    ------------


  3. #3
    SitePoint Zealot dkilburn's Avatar
    Join Date
    Jul 2000
    Location
    Inyokern, CA
    Posts
    181
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    When I add the following:

    BODY
    {background-image:url("graphics/background.jpg");}

    my background will work in netscape, but not in internet explorer. If I change it to

    background-image:url("../graphics/background.jpg");

    it works in IE but not netscape. Is there a base tag or something I need to include in the CSS file? This is starting to drive me crazy!
    Debby Kilburn
    "With computers, everything is possible, but nothing is easy"
    AIM: fourhweb

  4. #4
    SitePoint Enthusiast GodFather's Avatar
    Join Date
    Aug 2000
    Posts
    50
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I know this is a little bit more work, but try putting the full URL in there, that should fix the problem.

  5. #5
    Your Lord and Master, Foamy gold trophy Hierophant's Avatar
    Join Date
    Aug 1999
    Location
    Lancaster, Ca. USA
    Posts
    12,305
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Actually if you put it in there exactly like I said originally it will work on your webserver. Might not work on your local PC but it will definately work on your server.
    Wayne Luke
    ------------


  6. #6
    SitePoint Zealot dkilburn's Avatar
    Join Date
    Jul 2000
    Location
    Inyokern, CA
    Posts
    181
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I appreciate the responses. I made the changes (using /graphics/background.jpg), uploaded to the server, and now the background doesn't show on either browser. Before, when I tried (graphics/background.jpg) it at least showed on Netscape.

    I am using the most current versions of both browsers.

    The page in question is http://www.jps.net/dkilburn, with the css file at http://www.jps.net/dkilburn/css/homepage.css.
    I guess for now, I'll just use absolute URLs. I'm sure it's just a minor thing somewhere.

    Thanks for taking the time to make suggestions!

    Debby Kilburn
    "With computers, everything is possible, but nothing is easy"
    AIM: fourhweb

  7. #7
    Your Lord and Master, Foamy gold trophy Hierophant's Avatar
    Join Date
    Aug 1999
    Location
    Lancaster, Ca. USA
    Posts
    12,305
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    When I try to pull up your CSS page by clicking on the link you provided I get a 404 error.
    Wayne Luke
    ------------


  8. #8
    SitePoint Enthusiast
    Join Date
    Jun 2000
    Location
    WA
    Posts
    73
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Have you tried placing your CSS file in the same directory as your html files? Netscape and IE treat external CSS file relationships differently.

    One relates all file calls to the CSS file, while the other relates them to the html file. I don't remember which one does which.

    I've always placed the CSS file with the html files and called graphics from graphics/somefile.xxx with good success.

    hth

  9. #9
    SitePoint Zealot dkilburn's Avatar
    Join Date
    Jul 2000
    Location
    Inyokern, CA
    Posts
    181
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Try going to the css directory http://www.jps.net/dkilburn/css/. The file, homepage.css is there. When I click on it from there, however, nothing happens.

    The code pertaining to the body for the top-level index page is:

    BODY
    {
    background-color: #FAFAEC; /*off white background*/
    /*background-image:url("http://www.jps.net/dkilburn/graphics/background.jpg");*/
    background-image:url("/graphics/background.jpg");
    background-attachment: fixed;
    }

    The code in the comment tag is what I currently use that works.

    Right now I have a file setup for each level of my site. My goal is to just have one file that deals with all of the pages.

    I guess I could place the css file in each directory, but that would defeat the goal of having just one file. I've got it working right now with everything in the css file if I use absolute URLs for the images. I just like using relative URLs whenever possible.

    Again, thanks for your comments!
    Debby Kilburn
    "With computers, everything is possible, but nothing is easy"
    AIM: fourhweb


Bookmarks

Posting Permissions

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