Hello Everyone!
I am facing problem in the site published using github. The background image is not getting displayed when i publish the site. However, it is displaying in my local computer.
The backround image is named as ‘4’ and is present in images folder.
I am not able to get where is the problem occuring and how to resolve it.
The link to my published site is: https://aayushibansal2001.github.io/Blog-Page/
The link to my github repository is:https://github.com/aayushibansal2001/Blog-Page
Change your file format of image 4.JPG to 4.jpg in your images folder. This error is occuring because you have used 4.jpg in your css files…
How do we convert from .JPG to .jpg? Aren’t both the same?
Also i have tried doing 4.JPG in my css file, but then also the problem didn’t resolve.
I think it is solved now…
And yes both .JPG and .jpg are same extensions but in some OS it became case sensitive and hence always preferable to use lower case extensions…
Yes. The problem is resolved now. Thanks for the help.
Hello, I am facing more or less a similar problem, because my profile picture is not displaying when I publish my website and it shows like this:
I have saved it as “profile-picture.png” in the images folder, so why does it not work? Please help me!
Link to website: https://valentina-caponi.github.io/my-profile/
Thank you!!
you should write src=“profile-picture.png” instead of src=“images/vals.jpeg”
Hi, thanks for answering! I have done that. I have written src=“images/profile-picture.png” on HTML, but the image still does not show.
And do you know why when I have to load the images folder on Github it does not accept the folder but only the image?
Try writing src=“profile-picture.png” and not src=“images/profile-picture.png” because you don’t have images folder uploaded.
And also the folders are not accepted. so to make the folder you can click on the create file button and and the name of the folder and press enter. Then add any file and commit that. After that you can add the images in that folder created.
I hope it helps.
Thank you a lot! It actually worked.
However, I don’t understand why it didn’t accept my images folder. I had created it and added the image inside as you said. Not sure.
I am facing same issue. In my case .jpg and .JPG are not the problem though in github pages background image is not showing.
here is my code:
.showcase-area{
height: 50vh;
background: url("/images/header-image2.jpg");
background-position: center;
background-size: cover;
background-repeat: no-repeat;
}
Link: https://den864.github.io/restaurant-web/
repo : https://github.com/den864/restaurant-web
thank you
It looks like a relative path issue. The browser is looking inside the css folder for the images directory instead of the root of your site. You’ll need to move up a directory to the root using a relative link before it’ll work:
background: url("../images/header-image2.jpg");
Yeah it’s working. I almost forget that btw thanks 