How to call on a css

Discussion in 'Web Design and Development' started by JBaker122586, Mar 4, 2008.

  1. JBaker122586 macrumors 65816

    Joined:
    Jun 21, 2007
    #1
    Hey, I just have a quick question whose solution will hopefully make my site look a bit better and save me a bit of bandwidth.

    Anyway, my problem is...
    I have a multi-page website, and each section obviously has it's own index page (for instance: /pictures/index.html and /media/index.html).

    Now, I want to use the same stylesheet in the root directory for every page. However, if I just try to use the same outline for each directory's index.html page it shows that the css it's calling on does not exist in that directory, so it doesn't find it. The pertinent html is:
    HTML:
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <link href="style.css" rel="stylesheet" type="text/css" />
    <title>Brand New Street</title>
    </head>
    
    <body>
    <div id="container">
    	<div id="header">
    To temporarily alleviate the problem, I've copied the "images" folder and stylesheet from the root directory and into each individual directory. However, this causes all the images to reload each time you navigate to a different section of the site (unless, of course, they're cached).

    I'm sure there has to be a way to just call on the stylesheet and images in the root directory so I save some bandwidth and it doesn't look silly when the content is loaded but waiting for the header to reload on each page.

    Thanks in advance for any help.
    My site URL is www.brandnewstreet.com in case looking there will help clarify what I'm talking about.
     
  2. JSchwage macrumors 6502a

    JSchwage

    Joined:
    May 5, 2006
    Location:
    Rochester, NY
    #2
    Instead of using "images/picture.jpg" in your CSS, use a slash in the front like this: "/images/picture.jpg". Any time you have a slash in the very front, this tells it to look in the root directory on the site. Hope that helps!
     
  3. ergdegdeg Moderator emeritus

    ergdegdeg

    Joined:
    Oct 13, 2007
    #3
    Use ".." to change to the superior folder.
    e.g. <link href="../style.css" rel="stylesheet" type="text/css" />
    Like that you can navigate to any directory on your server.
     
  4. JSchwage macrumors 6502a

    JSchwage

    Joined:
    May 5, 2006
    Location:
    Rochester, NY
    #4
    That won't work if the page he's on is a subdirectory though. My solution will work on any page, even if it's a subdirectory.
     
  5. JBaker122586 thread starter macrumors 65816

    Joined:
    Jun 21, 2007
    #5
    Thanks a lot. I'll try it out and hope it works.
     
  6. JBaker122586 thread starter macrumors 65816

    Joined:
    Jun 21, 2007
    #6
    It worked awesome, thanks alot.

    Now, I also have another question that should be pretty obvious too, I'm sure, but this is my first real foray into site building.

    I want to make the sides of the page (to the left and right of the main tables where no content is) a darker gray color than the background of the actual content. Where in my .css would I do this? Do I need to set that darker gray as my background color and then put the lighter gray that is my current background color in a different area so that it's only on the tables?
    What's the easiest solution here.

    Again, you can look on www.brandnewstreet.com to see what I'm talking about.
     

Share This Page