Hi everyone,
I hope you will be able to help me out. I am trying to build my own project from scratch. I have tried attaching the photos that I need in CSS and I have tried to attach them in HTML files. However, every time I launch the website from the browser the link is showing as broken. I checked and the pics are still available online (they are royalty-free) and they are also located in folders on my computer. What should I check next?
thanks in advance.
Whitney
Can you post the code that is giving you an issue?
I think you need to tweak the format for the <img src = tag, right?
Something like:
<img src="https://www.example.com/images/blah.jpg"> alt="Blah Blah, etc" width="200" height="80">
Also, I think you have spaces in the link (text) itself.
okay, thanks. It is located on my computer, but I also have the links from the internet so I’ll try that to see if it works.
Thanks for your help!
Maybe fix the spacing issues in the file name location too. I’m squinting at it and it looks like there are spaces in the file name.
@lisalisaj is right you have a spacing error in your link. There is another problem though.
When your browser attempts to find the picture your <img> tag points to, than unless it points to an link, it has to choose a directory to start from. The directory it looks in is the same directory the currently active html file is located in, or in this instance, Main. Since there is no directory, Popcorn Website, located in Main it can’t find the file path specified.
In order to find the file you want, you are going to have to look back a couple directories from the current one.
I’ll take another look. This is my first time trying to use a picture that I’ve downloaded to a folder on my computer. Usually, I just have it point to the web address. For the sake of getting this first project underway, I may just use the web link instead if I can’t get it to work. Thanks again!
Back again. Links still broken. So I went back to the website copy and pasted the link, got rid of the spaces, saved it and reloaded the page. Still broken. Then I looked at the folders I have Popcorn Website which is the main folder, and under that, I have Main, which holds my HTML and CSS files, then I have another folder ( It’s not inside of Main), called “pics etc” with a space between.
Fixed! Now I can move on to trying to get the right size in CSS haha.
Personal preference, but I’d recommend using a percentage or something similar as opposed to a measurement in pixels. This ensures the pictures size will change with the browsers screen size.
Thanks. I’m going to give it a try.
