CSS Root Directory

CSS root directory

/Images/myImage.png

this has to be in root of your domain/subdomain

http://website.to/Images/myImage.png

and it will work

However, I think it would work like this, too

  • images

    • yourimage.png
  • styles

    • style.css

style.css:

body{
background: url(../images/yourimage.png);
}

How to get the root directory of wordpress in css

The CSS you used gives you the domain root.

So if your domain is www.site.com your css tries to request:

www.site.com/assets/images/_userfiles/bg_1.png

files mentioned in CSS when not used with an absolute path as you have done are relative to your css stylesheet file.

so, of you have your css file in:

www.site.com/wp-content/themes/mytheme/style.css

And you have your files in:

www.site.com/wp-content/themes/mytheme/assets/images/_userfiles/bg_1.png

you only need to remove your first '/' from your your css url();

#bg
{
display: block;
background: url('assets/images/_userfiles/bg_1.png') no-repeat center center;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

Recap

The base url is relative to your css file.

To go up one directory relative to your css file use url(../path/to/file/that/is/one/directory/up/from/your/css/file);

So, just examine in your ftp explorer which directory structure your css file is located and figure out your way to your assets folder.

You can use as many ../../../ you wish. If the max is reached the browser will default to the url of the site as if you had used a '/' to start your url.

Why can't I link my CSS when it's outside the root directory?

The php include is done by the php interpreter itself (it has access to ALL the system) and the user accesing your site has no way to modify that, the user doesn't even know and can not know that since there's no acces for him to that.

But for obvious security reasons you can't let a user have access to parent directories. Just imagin if someone could do a request to ../../../home/youruser/ and point to any file on the server! That would be insane and a really big security breach.

You just can not move up from DocumentRoot path when you do a request.

You have to move the css folder inside website and point at it using /css/style.css.

defining root directory for CSS & images in php

You are doing it in a wrong way. Try to use "http://" . $_SERVER['SERVER_NAME'] instead of __DIR__. Because you should pass web path to your html files.

absolute root url css

This should work

background: url('../images/background.jpg');

Specify a Root Path of your HTML directory for script links?

To be relative to the root directory, just start the URI with a /

<link type="text/css" rel="stylesheet" href="/style.css" />
<script src="/script.js" type="text/javascript"></script>

Import css file from same non-root directory

As it is an @import, make sure it is placed at the very top of your main CSS document.

@import url("./nav.css");

@import url("./width.css");

Although you can do it, I would personally advise against it. Although it might seem to be more "sorted" it creates extra HTTP requests, which depending on the size of the project, may hurt your performance.



Related Topics



Leave a reply



Submit