Grow your CSS skills. Land your dream job.

SOLVED: Reference to Root/CSS folder not working

  • # March 5, 2009 at 12:06 pm

    I’m building my first site using Panic Coda. The folder structure for the local root is user/design/projects/projectName/production/dev/

    Dev is the root folder for the site. There is a css folder in the root, and one folder for each page in the site. In the root index.html, the preview works. But for the other index.html files nested in the folders, the css isn’t being applied.
    In the import statement I’m referencing the css folder as "/css/style.css" with the root being the dev folder.

    The CSS is only being applied in the root index.html, and ignored on all the other pages. This is my first site and I have no idea what I’m doing wrong.

    # March 5, 2009 at 12:29 pm

    For the pages outside of the root (in their own folders [which, btw, I wouldn't recommend unless you plan on them being huge sections]), try this for importing the CSS file:

    Code:
    ../css/style.css
    # March 5, 2009 at 12:38 pm

    That worked! Thanks.

    Some of the sections have subsections. Is it standard just to have all of the different HTML files for each section in the root folder?

    I was just trying to organize them in their own folders, nesting the subsections with the main ones.

    # March 5, 2009 at 12:48 pm

    What I prefer to do is simply have a proper naming scheme and have all of the pages within the root. Now, this can change with a 1000+ page site of course. But here’s what I normally do:

    section-subsection-pagename.extension

    eg:

    health.html
    health-nutrition.html
    health-nutrition-calcium.html

    Things will still be organized and easy to find. Another reason I do this is I usually use a php include at the top of every page that includes meta data, javascript links, and css links.

    # March 5, 2009 at 1:12 pm

    That’s a useful tip. Thanks for sharing it.

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

You must be logged in to reply to this topic.

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