This probably a silly question but,
I have a project set up on my Desktop at:
~/Desktop/composer/
Inside this directory I have my folders:
css and templates
Inside my templates folder I have my index.html file, and I need to reference my css file in my css folder, but I can figure out how
I have tried:
/../css/style.css and /../../css/style.css, but neither of them work.
Thanks for your help.
You need to remove the leading /, since it denotes the root of your filesystem. Try ../css/style.css.
Related
I want the path to the file to look like this: "/assets/style/home.css"
But even though VSCode recognizes this path, and takes me there when I click it, the CSS doesn't appear on the page. It only appears when the path has the two dots: "../assets/style/home.css"
Any ideas on how can I fix this? This is what the entire path looks like:
It's like that with every single path I use in this project, actually. I have to use the two dots for everything.
The "../" means that it is to return a directory, as your HTML file is inside the PAGES directory it is necessary to use the "../".
To call the css file like this "/assets/style/home.css" you need to move the assets folder into the PAGES folder
The "../" before the file path is used to move up one directory level. It seems that the HTML file linking to the CSS file is in a subdirectory and the CSS file is in a directory one level up. If you want to use the path "/assets/style/home.css" the file should be in the same directory as the HTML file or a subdirectory of the HTML file.
You could also consider using absolute path instead of relative path, it would work regardless of where the HTML file is.
Upvote if it helps.
Your code should work if RANDOMWEBSITE is the root folder of the web server.
It will work in VSCode if you open the folder RANDOMWEBSITE, but perhaps your webserver is configured to use a different root folder above your directory.
For example the root folder might be html, and your website is at html/RANDOMWEBSITE/. In this case it would look for the css file in html/assets/style/home.css, rather than html/RANDOMWEBSITE/assets/style/home.css.
Check what the root folder of the webserver is set to and reconfigure, or alternativly remove the RANDOMWEBSITE folder from your folder tree and work within the existing root folder.
You have to do that because .html is isn't "in the same line" as css. You can imagine that it's something like a crossroad if turn right but then you realise that you want to go left firstly you have to go back and than you can turn left. If you want do do "/assets/etc" you need to move you .html file to "randomwebsite/.html"
I am learning HTML and i am keeping my secondary websites in /subwebsites/website.html
/ is the root folder containing also index.html:
File structure
However, opening the subwebsites anywhere outside of the VSCode live server browser makes the subwebsites not be able to find any stylesheet, other .html file or image anymore. It works with the index.html, but as soon as the website is contained in a subfolder it won't work anymore. I am sure it has to do with the way my paths are set but i tried everything I know off:
styles/main.css
./styles/main.css
/styles/main.css
picture showing how i added my paths
Thanks for your help in advance.
In this case your html file need to go one level up. So for this you can easily use ../.
So just use this:
../styles/main.css ^_^
or
./../styles/main.css for your subwebsites.
But better to think to start use some kind of local server. For example, live-server for VSCode.
Also useful information for you:
/ - root of the current drive
./ - current directory
../ - parent of the current directory
you can use ~/styles/main.css or ../styles/main.css
../ is previous folder
~/ is root of server
The reason, may be server look for style inside this folder. And can't find it.
I stored my index.css in my css folder but the pictures i put here is outside the css folder and is inside the pics folder. I tried ../pics/walp.png but it's not working.
I suggest you compare the complete directory trees of both the .CSS and .PNG files and also make sure you have the exact path of .PNG file mentioned in the .CSS.
You may have to check it from the command line (in terminal), to get the complete folder paths.
For each time you go back a folder you have to make sure you include
a ../ to represent going back a folder.
Make sure spelling and capitalization are also in check.
One other option is to see if you can use /pics/walp.png -
sometimes this works based on file structure and operating system (however, relative paths are always recommended if you can get it to work)
Also, it would help to see the code you are using to make sure its
not the code causing the problems instead of file paths.
I've been trying to resolve this issue with my website (www.wintonbrownmusic.online). I've attached a picture of how my site looks locally. When I upload it through GoDaddy, the site looks differently. I understand that others have had this issue but not sure where/how to change the CSS file to link to my website so it'll look the way that it should. Can someone assist?
I'm not sure what your hosting / creating it with, but I had a quick look at your site and found one issue.
Your HTML file is looking for the bootstrap.css file in the assets/css folder, but it appears to be in the root folder.
unless your hosting with something that is supposed to find it there.
not sure.
but when is use http://www.wintonbrownmusic.online/assets/css/bootstrap.css is doesn't work, but if I use http://www.wintonbrownmusic.online/bootstrap.css it does work.
hope that helps.
You have problems with path, If you open the console in inspect element it will show you that you have problems in calling the required files css, js, and other files.
You need to upload folders properly in the host, you need to add folders like you have in local folders in your computers. "assets" folder is missing and you just upload files inside there.
change your folder name as either assets or css ....
assets/css is a folder name because of the slash (/) browser looking for css folder inside assets folder...just give the folder
name correctly try to avoid usage of special character ,punctutation
in folder name
I have an HTML file, index.html, for my website, in a folder. This folder contains the index.html file, and another folder called "Stylesheets", with the stylesheet.css file inside. How do I link to it? I know how to do a link tag, but the href bit is giving me a bit of trouble. I've tried
href="../stylesheets/stylesheet.css"
and a few variants of it with the dots. Any ideas? I've tried a couple google searches but the question is a bit too complex to describe in a simple google query. Please Help!
Your path - href="../stylesheets/stylesheet.css" is basically doing the opposite of what you want.It's not going one folder further as you wish.
To accomplish what you want, you are going to have this path:
href="stylesheets/stylesheet.css"
Here you can read more about File Paths.
Use href="stylesheets/stylesheet.css" or href="./stylesheets/stylesheet.css"
Both mean the look for stylesheet.css file inside the stylesheet folder inside the current folder.