I am learning html at the moment, and I am following a tutorial step by step. I got far into the tutorial to find out that my css and my images are both not linked to my website! The site shows that there is supposed to be an image there, but it does not appear, and as for the css, no signs of it at all. I would really like to finish this tutorial without giving up (which I often do) so please help me out here. Thanks a lot for your time. The problems:
(1) What kind of tutorial are you following? What is it supposed to do?
(2) Are you working throuigh the tutorial on a test web site or on your computer?
(3) Both the link and and img paths look correctly formed. The question becomes is the .css file located where the link is pointing and is the image located where the path says it is?
www.mysite.org/index.htm /* the home page, whatever it is named */
www.mysite.org/img/hotmail5.png
www.mysite.org/css/styles.css
In a simple site, the index file is located in the “root” direcory by default.
Your paths show that there is an /img/ and a /css/ directory in that root location also. The target files should reside within those directories. The image within the /img/ folder, and the css file withing the /css/ direcory.
Syntax and Punctuation matter. Also be sure that all cases in the path and filenames are the same. Images should have dimension in the “width” and “height” attributes and should include an “alt” value that is displayed if the image is not found.
If you have not done so, please read our posting guidelines for suggestions about posting code and describing problems:
You can probably post your code in a “working page” so we can see exactly what you see.
If you are using a test site, please post a link to the test site.
Use the validators given to you by @John_Betong. They should be your best friends while developing a web page.
Thank you for the feedback! Sadly, I do not own a domain, and am just making a local website while I am still learning, so I am not quite sure if this test will still work. Regardless, I tried it, and it said the websites does not exist. Once again, thank you very much for the help!
Thank you for taking time to help me! The tutorial is on making a generic, sample website to show you the basics of html and css design, linked here: https://www.youtube.com/watch?v=Wm6CUkswsNw
And yes, sadly, it is a locally stored computer site, so that limits my options. I will double check my path directories/ folders, thank you!
I’m going to show my ignorance here and ask what the significance of the leading dot is. I’m familiar with two dots to indicate going up a level e.g. ../img/hotmail5.png but I haven’t come across single dots before.
so for all intents and purposes “./img/hotmail.png” is equivalent to “img/hotmail.png”. I’m not sure if browsers see it that way though.
It’s mostly used when working on a *nix machine where you have to run ./binaray if the binary is in the current directory to avoid people from downloading a file called cd or ls or some other built in name and accidentally execute that instead of the builtin cd or ls.
Other than that I see no real use for the single dot.
Wow! Thanks a lot! Still, for the CSS, it is not quite working, single or double dot, but hey, the images are working! Do you have any possible fixes for the CSS! Thanks for all of your help!
Only a wild guess, but I’ve seen it before. When you use external JavaScript and CSS files, the code in them should not be inside <script> or <style> tags like it would be if it were in the page itself.
