Check out my GitHub page at
You can also view the repository here: https://github.com/chryspenalber/hercules
I'm encountering an issue where the images inserted through CSS are not showing up on the GitHub page, although they display fine on localhost. What could be causing this problem?
I've read articles suggesting that it might be a case sensitivity issue, but I've tried various solutions with no success. Other projects I've worked on have displayed images without any issues, so I'm puzzled about what's different in this case.
This is just one example, but it seems to affect all images on the page.
<div class="img-overlay"></div>
<div id="topo">
<a href="#">
<img src="assets/images/chevron-double-up-white.svg" alt="">
</a>
</div>
.img-overlay {
position: absolute;
top: -300px;
left: 0;
width: 100%;
height: 2400px;
background: linear-gradient(to bottom, transparent 70%, var(--bg-color) 100%), url(/assets/images/bg-hercules.jpg) no-repeat top center / cover;
opacity: 1;
z-index: -1;
}