CSS import form different directory

HTML & CSS
1

Hello I’m trying to pull css files in my master css file using the import function.
I have the files as so:

main>css>master.css
main>tls>css>adtional.css

So my mater file is in a folder call css and the additional files are in a completely different directory call tls.

So far I can only get files that work from with in the css file directory and sub-directory and nowhere else. The only other option would be to move the master css file to the main folder where everything becomes a sub directory. But that will mess up my setup.

2

How have you written the @import function?

3

@import url(“reset.css”);

4

That assumes the reset is in the same folder as the stylesheet you’re linking to it from.

You need to use a root or relative reference to give the file path to the reset sheet.

5

Using a relative path you could get to the files from the master css like this:


@import url("../tls/css/reset.css");

Relative and root relative paths explained here.

6

I tried that and it did not work.

7

Then your directory is probably not set up as you said or you have a typo or error somewhere. I just double checked locally and created the directory structure exactly as you said above and it worked with no problems.

main>css>master.css
main>tls>css>adtional.css

Lets break it down:

we are in the css folder so we want to go up one level to main.
…/

From main we want to go into the tls folder
tls/

then we want to go into another css folder
css/

then we select the file
reset.css

@import url(“…/tls/css/addtional.css”);

Is the site online somewhere where we can inspect it and see where things really are?