CSS file pathing problem

Question

Hi there,

When designing a HTML template in my favorite editor (TextPad at the moment) I can view my code in a browser by pressing F11 or the appropriate toolbar button. I have my common css rules in a separate file so my HTML contains the code:

<link rel="stylesheet" href="commoncss.css" type="text/css">

This works when the .css file is in the same folder as the .html file, or if I fully path the .css file in the href property, eg. ///c:/mycssfolder/commoncss.css

However, in a 'live' situation I want the .css file to reside in a common folder which is accessible from a number of .html files (eg. href='css/commoncss.css', where the css folder is configured at web-server level).

How can I achieve this design vs. live dilemma without copying css file to all .html folders (and all the maintenance headaches that comes with it)?

I am using Python 3.1 with Jinja2, but I guess this problem is applicable across any language and template-engine.

Any help would be appreciated.

Alan

Answer 1

If you put your CSS files in a top-level "/css" directory, then your HTML files can just refer to that.

<link rel='stylesheet' href='/css/style_file1.css'>

I don't know much about your framework; sometimes there's an additional layer under the server root to identify an "application" or something. If that's the case, it'd be "/appname/css/filename.css".

Answer 2

<link rel='stylesheet' href='../css/stylesheet.css'>

This will move down a level, then up a level to /CSS/.